使用具有数组长度的 jsview答案

【问题标题】：Using jsviews with array lengths使用具有数组长度的 jsview
【发布时间】：2013-02-19 07:52:32
【问题描述】：

我有这个模型：

var taskGroups = 
[
   {name:"Notepad", tasks:[]}
];

我的目标是按以下格式在列表中显示每个任务组：{Name} {numOfTasks}

如果 taskGroup 有一个空的 tasks[]，则不应显示它。

这是我作为 jsfiddle 的尝试： http://jsfiddle.net/ARS2E/

这是我的模板：

<script id="tmpl" type="text/x-jsrender">
   {{if tasks.length}}
      <li class="tasklist-item">{{>name}} ({^{:tasks.length}})</li>
   {{/if}}
</script>

这是我的 javascript：

var taskGroups = [{name:"Notepad", tasks:[]}];
var lastID=0;

$.templates({ tasklistTemplate: "#tmpl" });
$.link.tasklistTemplate("#tasklist", taskGroups);

$("#btnAdd").on("click", function()
{
    $.observable(taskGroups[0].tasks).insert(0, {taskID:++lastID});
});
$("#btnRemove").on("click", function()
{
    if(taskGroups[0].tasks.length)
    {
        $.observable(taskGroups[0].tasks).remove(0, 1);
    }
});

我无法让它工作，并且不确定我哪里出错了。非常感谢任何帮助。

【问题讨论】：

标签： jsrender jsviews

【解决方案1】：

两个问题：First, {{if tasks.length}} 不是数据绑定的。如果你写{^{if tasks.length}}，那么它将是数据绑定的。

其次，在 jsfiddle 中，jsrender.js 的路径错误 - 它不是 jquery.render.js。

【讨论】：