如何在Handlebars中获得每个帮助者的索引？

我在我的项目中使用Handlebars模板。 有没有办法获得Handlebars的“每个”帮手的当前迭代的索引？

<tbody> {{#each item}} <tr> <td><!--HOW TO GET ARRAY INDEX HERE?--></td> <td>{{this.key}}</td> <td>{{this.value}}</td> </tr> {{/each}} </tbody> 

Answer 1

在较新版本的Handlebars索引（或对象迭代的情况下，键）默认情况下与标准的每个助手一起提供。

---

摘自： https ： //github.com/wycats/handlebars.js/issues/250#issuecomment-9514811

当前数组项目的索引现在已经可用一段时间了@index：

 {{#each array}} {{@index}}: {{this}} {{/each}} 

对于对象迭代，请使用@key：

 {{#each object}} {{@key}}: {{this}} {{/each}} 

Answer 2

这在Ember的新版本中已经改变了。

对于数组：

 {{#each array}} {{_view.contentIndex}}: {{this}} {{/each}} 

看起来像#each块不再在对象上工作。 我的build议是推出自己的帮手function。

感谢您的提示 。

Answer 3

我知道这太晚了。 但我用下面的代码解决了这个问题：

Java脚本：

 Handlebars.registerHelper('eachData', function(context, options) { var fn = options.fn, inverse = options.inverse, ctx; var ret = ""; if(context && context.length > 0) { for(var i=0, j=context.length; i<j; i++) { ctx = Object.create(context[i]); ctx.index = i; ret = ret + fn(ctx); } } else { ret = inverse(this); } return ret; }); 

HTML：

 {{#eachData items}} {{index}} // You got here start with 0 index {{/eachData}} 

如果你想开始你的索引1，你应该做下面的代码：

使用Javascript：

 Handlebars.registerHelper('eachData', function(context, options) { var fn = options.fn, inverse = options.inverse, ctx; var ret = ""; if(context && context.length > 0) { for(var i=0, j=context.length; i<j; i++) { ctx = Object.create(context[i]); ctx.index = i; ret = ret + fn(ctx); } } else { ret = inverse(this); } return ret; }); Handlebars.registerHelper("math", function(lvalue, operator, rvalue, options) { lvalue = parseFloat(lvalue); rvalue = parseFloat(rvalue); return { "+": lvalue + rvalue }[operator]; }); 

HTML：

 {{#eachData items}} {{math index "+" 1}} // You got here start with 1 index {{/eachData}} 

谢谢。

Answer 4

在手柄版本3.0以上，

 {{#each users as |user userId|}} Id: {{userId}} Name: {{user.name}} {{/each}} 

在这个特定的例子中，用户将具有与当前上下文相同的值，并且userId将具有用于迭代的索引值。 请参阅 – 帮助手册中的http://handlebarsjs.com/block_helpers.html部分;

Answer 5

arrays：

 {{#each array}} {{@index}}: {{this}} {{/each}} 

如果你有对象的数组…你可以遍历孩子：

 {{#each array}} //each this = { key: value, key: value, ...} {{#each this}} //each key=@key and value=this of child object {{@key}}: {{this}} //Or get index number of parent array looping {{@../index}} {{/each}} {{/each}} 

对象：

 {{#each object}} {{@key}}: {{this}} {{/each}} 

如果您有嵌套的对象，则可以使用{{@../key}}访问父对象的{{@../key}}