2014-06-25 24 views
0

所有Handlebars示例都實現了具有數組或名稱的循環,但是我的json數組沒有任何名稱。在無名對象或數組上實現handlebars.js的循環

我的數據是這樣的:

[ 
    {"$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}},但他們都會導致「無內容」。

我做錯了什麼?

回答

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/