Как получить индекс в 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>
Ответы
Ответ 1
В новых версиях индекса Handlebars (или ключа в случае итерации объекта) по умолчанию предоставляется стандарт каждого помощника.
фрагмент из: https://github.com/wycats/handlebars.js/issues/250#issuecomment-9514811
Индекс текущего элемента массива был доступен в течение некоторого времени через @index:
{{#each array}}
{{@index}}: {{this}}
{{/each}}
Для итерации объектов используйте @key вместо:
{{#each object}}
{{@key}}: {{this}}
{{/each}}
Ответ 2
Это изменилось в новых версиях Ember.
Для массивов:
{{#each array}}
{{_view.contentIndex}}: {{this}}
{{/each}}
Похоже, что блок #each больше не работает с объектами. Мое предложение состоит в том, чтобы перевернуть для него свою вспомогательную функцию.
Спасибо за этот совет.
Ответ 3
Я знаю, что это слишком поздно. Но я решил эту проблему со следующим кодом:
Java Script:
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}}
Спасибо.
Ответ 4
В версии с рулем версии 3.0 и далее,
{{#each users as |user userId|}}
Id: {{userId}} Name: {{user.name}}
{{/each}}
В этом конкретном примере пользователь будет иметь то же значение, что и текущий контекст, и userId будет иметь значение индекса для итерации. Refer - http://handlebarsjs.com/block_helpers.html в блоке помощников блока
Ответ 5
Массивы:
{{#each array}}
{{@index}}: {{this}}
{{/each}}
Если у вас есть массивы объектов... вы можете выполнять итерацию через дочерние элементы:
{{#each array}}
//each this = { key: value, key: value, ...}
{{#each this}}
//each [email protected] 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}}