使用Jquery模板处理无结果行的更好方法

Question

我正在使用JQuery模板,并且如果阵列中没有结果发送到模板,则希望生成一行"未找到结果".我现在处理它的方法是有两个模板 - 一个输出行,另一个输出为no行存在实例,但这对我来说似乎很脏.有没有更好的方法来处理这种情况？

if(results.length == 0)
   $( "#NoRowsTemplate" ).tmpl( results ).appendTo("#tableid")
else
   $( "#HasRowsTemplate" ).tmpl( new Array(1)).appendTo("#tableid")

以下是包含行的模板示例:

<script id="HasRowsTemplate" type="text/x-jquery-tmpl">
<tr>
<td>${name}</td>
</tr>
</script>

这是一个没有行的模板示例:

<script id="NoRowsTemplate" type="text/x-jquery-tmpl">
<tr>
<td>No Rows Were Found</td>
</tr>
</script>

Answer 1

你可以使用{{if}}和{{else}}.

如果没有真正看到有问题的模板,很难说出更多.

更新:

好的,你发布了一些例子,所以我现在可以说更多.首先,你桌子的其他部分在哪里？为什么不在模板中？原始数据会附加到现有表格中,但我认为这只会执行一次,因为否则您不会在表格中附加"No Rows Were Found"消息,但您将替换现有内容.

首先,在这种特殊情况下,您可以使用快速入侵并使用:

if (results.length === 0) {
    results = ["No Rows Were Found"];
}
$( "#NoRowsTemplate" ).tmpl( results ).appendTo("#tableid");

它应该只是做你想要的,但我不推荐这种方法,因为它改变了数组,可能会导致代码的其他部分出现一些问题.我建议做这样的事情:

$( "#newTemplate" ).tmpl({ results: results }).appendTo("#tableid");

使用这个新模板:

<script id="newemplate" type="text/x-jquery-tmpl">
  {{if results.length}}
    {{each results}}
      <tr>
        <td>${value}</td>
      </tr>
    {{/each}}
  {{else}}
    <tr>
      <td>No Rows Were Found</td>
    </tr>
  {{/if}}
</script>

我还将表格HTML的其余部分添加到此模板的开头和结尾.