Question

所有Handlebars示例都实现了包含数组或对象名称的循环，但我的json数组没有任何名称。

我的数据类似于：

[
    {"$id":"1","SiteItemID":1,"Title":"Title 1","CreateDate":"2014-06-19T14:12:22.157"},
    {"$id":"2","SiteItemID":2,"Title":"Title 2","CreateDate":"2014-06-19T14:12:22.157"},
    {"$id":"2","SiteItemID":3,"Title":"Title 3","CreateDate":"2014-06-19T14:12:22.157"},
]

我想在表行中使用它们，我的html就像：

{{#each object}}
<tr data-id="{{this.SiteItemID}}">
    <td class="title col-xs-8">
        {{this.Title}}
    </td>
    <td class="date text-right col-xs-2">
        {{this.CreateDate}}
    </td>
</tr>
{{else}}
No Content
{{/each}}

我将它们与以下JS代码放在一起：

function getData() {
    $.ajax({
        url: 'http://192.168.101.223:81/api/siteitem'
        , success: function(data) {
            return data;
        }
    });
}
function showData() {
    var data = getData();
    var template = $("#itemlist-table").html();
    var handlebarsTemplate = Handlebars.compile(template);
    var output = handlebarsTemplate(data);
    $("#mainbody").html(output);
}
showData();

我尝试了{{#each object}}和{{#each array}}，但他们都导致了“没有内容”。

我做错了吗？

Answer 1

您需要使用{{#each []}}

{{#each []}}
<tr data-id="{{this.SiteItemID}}">
    <td class="title col-xs-8">
        {{this.Title}}
    </td>
    <td class="date text-right col-xs-2">
        {{this.CreateDate}}
    </td>
</tr>
{{else}}
No Content
{{/each}}

这是我的小提琴

http://jsfiddle.net/ckross01/K49xy/

在无名对象或数组上实现handlebars.js的循环

1 个答案: