车把按属性名称动态显示对象属性

Question

{{#each modelItems as |item|}}
<tr>
    <td>
        {{ item.name }}
    </td>
    {{#each selectedColumns as |extraCol|}} // line 27
        <td>
            {{ extraCol }}
            {{ item[concat '"' extraCols '"'] }} // what I tried
            {{ item[(concat '"' extraCols '"')] }}
        </td>
    {{/each}}
</tr>
{{/each}}

在模板中我有一个 modelItems 的列表。在 table 中显示了一些特定的列，但在 selectedColumns 列表中也可能有可选的列。作为第 27 行，我正在循环 selectedColumns 来显示它们，但没有运气。 Handlebars 如何通过属性名称动态显示对象属性？

在 JS 中它会像

foreach (items in selectedColumns) {
    console.log(item.name);
    foreach (column in selectedColumns) {
        console.log(item['"'+column+'"']);
    }
}

Answer 1

车把内部 {{ 您不能编写 JS 代码，因此您无法使用 [] 访问集合中的项目。而是写一个助手，returns 选中的项目。

我写了个例子here

Answer 2

还有 get helper you can access a property of an object dynamically. If you combine this with the subexpressions of handlebars, you can still use the concat 助手。

您的代码将类似于：

{{#each modelItems as |item|}}
<tr>
    <td>
        {{ item.name }}
    </td>
    {{#each selectedColumns as |extraCol|}}
        <td>
            {{get item (concat '"' extraCol  '"')}}
        </td>
    {{/each}}
</tr>
{{/each}}

车把按属性名称动态显示对象属性

Handlebars display object property dynamically by property name

javascript

handlebars.js

ember.js

ember-data

车把按 属性 名称动态显示对象 属性

Handlebars display object property dynamically by property name

javascript

handlebars.js

ember.js

ember-data

车把按属性名称动态显示对象属性