javascript 车把柜台#each
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/15148528/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Counter for handlebars #each
提问by algorithmicCoder
In Handlebars, say i have a collection of nameshow can i do
在 Handlebars 中，说我有一个names我该怎么做的集合
{{#each names}}
{{position}}
{{name}}
{{/each}}
where {{position}} is 1 for the first name, 2 for the second name etc. Do I absolutely have to store the position as a key in the collection?
其中 {{position}} 是第一个名称的 1，第二个名称的 2 等。我是否绝对必须将位置存储为集合中的键？
回答by Smix
You can do this with the built-in Handlebars @index notation:
您可以使用内置的 Handlebars @index 符号来做到这一点：
{{#each array}}
{{@index}}: {{this}}
{{/each}}
@index will give the (zero-based) index of each item in the given array.
@index 将给出给定数组中每个项目的（从零开始的）索引。
Please note for people using Handlebars with the Razor view engine you must use the notation @@index to avoid compilation errors.
请注意，对于将 Handlebars 与 Razor 视图引擎一起使用的人，您必须使用符号 @@index 以避免编译错误。
For more built-in helpers see http://handlebarsjs.com/
有关更多内置帮助程序，请参阅http://handlebarsjs.com/
回答by serg
Handlebars.registerHelper("counter", function (index){
return index + 1;
});
Usage:
用法：
{{#each names}}
{{counter @index}}
{{name}}
{{/each}}
回答by Will Klein
While you can't do this with any native Handlebars helper, you can create your own. You can call Handlebars.registerHelper(), passing it a string with the name you want to match (position), and a function that would return the current position count. You can keep track of the position number in the closure where you call registerHelper. Here is an example of how you can register a helper called positionthat should work with your template example.
虽然您无法使用任何本机 Handlebars 助手执行此操作，但您可以创建自己的。您可以调用Handlebars.registerHelper()，向其传递一个带有您要匹配的名称（位置）的字符串，以及一个返回当前位置计数的函数。您可以在调用 的闭包中跟踪位置编号registerHelper。下面是一个示例，说明如何注册一个名为的助手position，该助手应与您的模板示例一起使用。
JavaScript:
JavaScript：
// Using a self-invoking function just to illustrate the closure
(function() {
// Start at 1, name this unique to anything in this closure
var positionCounter = 1;
Handlebars.registerHelper('position', function() {
return positionCounter++;
});
// Compile/render your template here
// It will use the helper whenever it seems position
})();
Here is a jsFiddle to demonstrate: http://jsfiddle.net/willslab/T5uKW/1/
这是一个 jsFiddle 来演示：http: //jsfiddle.net/willslab/T5uKW/1/
While helpers are documented on handlebarsjs.com, this took some effort for me to figure out how to use them. Thanks for the challenge, and I hope that helps!
虽然 helpers 记录在handlebarsjs.com 上，但我花了一些精力来弄清楚如何使用它们。感谢您的挑战，希望对您有所帮助！
回答by elin3t
only you have to use {{@index}}
只有你必须使用 {{@index}}
example:
例子：
{{#.}}
<li class="order{{@index}}"> counter: {{@index}}</li>
{{/.}}
回答by oldegreyg
Here is my preferred solution. Register a helper that extends the context to include your position property automatically. Then just use your new block helper (ex. #iter) instead of #each.
这是我的首选解决方案。注册一个扩展上下文以自动包含您的位置属性的助手。然后只需使用您的新块助手（例如#iter）而不是#each。
Handlebars.registerHelper('iter', function (context, options) {
var ret = "";
for (var i = 0, j = context.length; i < j; i++) {
ret += options.fn($.extend(context[i], {position: i + 1}));
}
return ret;
});
Usage:
用法：
{{#iter names}}
{{position}}
{{name}}
{{/iter}}
adapted from http://rockycode.com/blog/handlebars-loop-index/
回答by Yatender Singh
you can get value just from index inside the list.
您可以仅从列表内的索引中获取价值。
{{#each list}}
@index
{{/each}}
回答by ZenithS
Current method,
目前的方法，
Since Handlebars API V2 they already include an @numberIt's basically an index of the iterator start with 1.
从 Handlebars API V2 开始，它们已经包含一个@number它基本上是一个以 1 开头的迭代器的索引。
So, This is what you could have done.
所以，这就是你可以做的。
{{#foreach names}}
{{@number}}
{{name}}
{{/foreach}}
Reference: https://ghost.org/docs/api/v3/handlebars-themes/helpers/foreach/
参考：https: //ghost.org/docs/api/v3/handlebars-themes/helpers/foreach/
回答by Esteban Preciado
This works for me
这对我有用
<td>{{@index}}</td>
