如何迭代Handlebars中的对象数组？
这似乎是一个愚蠢的问题，但我似乎无法find答案的任何地方。
我打这个Web Api，返回JSON格式的对象数组：
把手文档显示以下示例：
<ul class="people_list"> {{#each people}} <li>{{this}}</li> {{/each}} </ul> 在以下方面：
{ people: [ "Yehuda Katz", "Alan Johnson", "Charles Jolley" ] }
在我的情况下，我没有数组的名称，它只是响应的根对象。 我试过用{{#each}}没有运气。
第一次使用把手…我错过了什么？
UPDATE
这里有一个简单的小提琴来显示我问： http : //jsfiddle.net/KPCh4/2/
句柄是否需要上下文variables是一个对象而不是数组？
你可以传递给每个块。 看到这里： http : //jsfiddle.net/yR7TZ/1/
{{#each this}} <div class="row"></div> {{/each}}
我的意思是在template()调用..
您只需要将结果作为对象传递。 所以，而不是打电话
var html = template(data);
做
var html = template({apidata: data});
并在模板代码中使用{{#each apidata}}
演示在http://jsfiddle.net/KPCh4/4/
（ if崩溃的代码，删除一些剩余的 ）
这个小提琴既有each和直接json。 http://jsfiddle.net/streethawk707/a9ssja22/ 。
以下是迭代数组的两种方法。 一个是直接json传递，另一个命名json数组，同时传递给内容持有者。
Eg1：下面的例子直接调用small_datavariables中的json键（data）。
在html中使用下面的代码：
<div id="small-content-placeholder"></div>
下面的代码可以放在html或者html的主体中：
<script id="small-template" type="text/x-handlebars-template"> <table> <thead> <th>Username</th> <th>email</th> </thead> <tbody> {{#data}} <tr> <td>{{username}} </td> <td>{{email}}</td> </tr> {{/data}} </tbody> </table> </script>
下面的文件准备就绪：
var small_source = $("#small-template").html(); var small_template = Handlebars.compile(small_source);
下面是json：
var small_data = { data: [ {username: "alan1", firstName: "Alan", lastName: "Johnson", email: "alan1@test.com" }, {username: "alan2", firstName: "Alan", lastName: "Johnson", email: "alan2@test.com" } ] };
最后将json附加到内容持有者：
$("#small-content-placeholder").html(small_template(small_data));
Eg2：使用每个迭代。
考虑下面的json。
var big_data = [ { name: "users1", details: [ {username: "alan1", firstName: "Alan", lastName: "Johnson", email: "alan@test.com" }, {username: "allison1", firstName: "Allison", lastName: "House", email: "allison@test.com" }, {username: "ryan1", firstName: "Ryan", lastName: "Carson", email: "ryan@test.com" } ] }, { name: "users2", details: [ {username: "alan2", firstName: "Alan", lastName: "Johnson", email: "alan@test.com" }, {username: "allison2", firstName: "Allison", lastName: "House", email: "allison@test.com" }, {username: "ryan2", firstName: "Ryan", lastName: "Carson", email: "ryan@test.com" } ] } ];
在将json传递给内容持有者时，只需以这种方式命名即可：
$("#big-content-placeholder").html(big_template({big_data:big_data}));
模板如下所示：
<script id="big-template" type="text/x-handlebars-template"> <table> <thead> <th>Username</th> <th>email</th> </thead> <tbody> {{#each big_data}} <tr> <td>{{name}} <ul> {{#details}} <li>{{username}}</li> <li>{{email}}</li> {{/details}} </ul> </td> <td>{{email}}</td> </tr> {{/each}} </tbody> </table> </script>
把手可以使用一个数组作为上下文。 你可以使用. 作为数据的根源。 所以你可以用{{#each .}}循环你的数组数据。
这里是你的小提琴的更新的工作版本
使用this和{{this}} 。 请参阅node.js中的以下代码：
var Handlebars= require("handlebars"); var randomList= ["James Bond", "Dr. No", "Octopussy", "Goldeneye"]; var source= "<ul>{{#each this}}<li>{{this}}</li>{{/each}}</ul>"; var template= Handlebars.compile(source); console.log(template(randomList));
控制台日志输出：
<ul><li>James Bond</li><li>Dr. No</li><li>Octopussy</li><li>Goldeneye</li></ul>
