Javascript Handlebars.js:如何访问嵌套的每个父索引?

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/14854491/
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

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-24 18:09:27  来源:igfitidea点击:

Handlebars.js: How to access parent index in nested each?

javascripthandlebars.js

提问by Fdr

How to access parent @index value in each-loop?

如何在每个循环中访问父@index 值?

Tried the following:

尝试了以下方法:

{{#each company}}
{{#each employee}}
  {{../@index}} // how to access company index here?
{{/each}}
{{/each}}

This results to an error:

这导致错误:

Expecting 'ID', got 'DATA'

期待“ID”,得到“数据”

回答by Kevin Decker

There is a syntax error in the example. The correct syntax is {{@../index}}.

示例中存在语法错误。正确的语法是{{@../index}}.

We are looking at ways that we can support custom naming of these parameters in future versions of the language so this is easier to deal with. https://github.com/wycats/handlebars.js/issues/907

我们正在寻找在语言的未来版本中支持这些参数的自定义命名的方法,以便更容易处理。 https://github.com/wycats/handlebars.js/issues/907

回答by strah

This worked for me:

这对我有用:

{{#each company}}
{{setIndex @index}}
{{#each employee}}
  {{../index}}
{{/each}}
{{/each}}

JS:

JS:

Handlebars.registerHelper('setIndex', function(value){
    this.index = Number(value + 1); //I needed human readable index, not zero based
});

Just make sure the companyobject doesn't have indexproperty.

只要确保company对象没有index属性。

回答by jordanb

Answer:{{@../index}}

回答:{{@../index}}

From the Handlebars docs(see bottom of 'each' helper section):

来自Handlebars 文档(参见“每个”助手部分的底部):

"Nested eachblocks may access the interation variables via depted paths. To access the parent index, for example, {{@../index}}can be used."

“嵌套each块可以通过 depted 路径访问交互变量。例如,{{@../index}}可以使用访问父索引。”

NOTE: I'm using v1.3 so it's at least that old.

注意:我使用的是 v1.3,所以它至少是旧的。

REMINDER: Helpers are your last best option. 9/10 there is a better solution.

提醒:帮手是您最后的最佳选择。9/10 有更好的解决方案。

回答by Andrew Toy

It looks like there's a new syntax in Ember v2.2.0. I tried all the answers here and they didn't work for me.

看起来 Ember v2.2.0 中有一个新的语法。我在这里尝试了所有答案,但它们对我不起作用。

What I found worked was naming the parent loop's index and the child loop's index.

我发现有效的是命名父循环的索引和子循环的索引。

{{#each parents as |parent parentIndex|}}
    {{parentIndex}}
    {{#each children as |child childIndex|}}
        {{parentIndex}}
        {{childIndex}}
    {{/each}}
{{/each}}

回答by Fish

registe an Helper method:

注册一个 Helper 方法:

Handlebars.registerHelper('eachWithIndex', function(cursor, options) {
    var fn = options.fn, inverse = options.inverse;
    var ret = "";
    var idx = -1;
    //console.log(cursor);
    cursor.forEach(function(item){
        idx++;
        console.log(item.index);
        item.index = idx;
        ret+=fn(item);
    });
    return ret;
}); 

handlebars template:

车把模板:

{{#eachWithIndex outer}}
  {{#each inner}}
   {{../index}} // access outer index like this. I used hanlebars V1.3.0
   {{index}} // access inner index
  {{/each}}
{{/eachWithIndex}}