通过车把获得名称价值

时间:2013-08-11 08:14:38

标签: meteor handlebars.js

我有一个巨大的桌子,有太多的列可以放在屏幕上。我希望用户能够使用复选框选择要显示的列。复选框部分很简单,但我不知道如何使用把手显示表格。我能帮助一些帮手吗?我正在使用Meteor.js。

{stats: 
    {symbol: 'A', stat1: 5, stat2, 24.3, stat3: 293, stat4: 3},
    {symbol: 'B', stat1: 4, stat2, 24.3, stat3: 293, stat4: 3},
    {symbol: 'C', stat1: 2, stat2, 24.3, stat3: 293, stat4: 3}
}

{columns:
    {key: 'stat1', name: 'Stat 1'},
    {key: 'stat2', name: 'Stat 2'},
    {key: 'stat3', name: 'Stat 3'},
    {key: 'stat4', name: 'Stat 4'}
}

{currentUser: {columnsToShow: ['stat1', 'stat3']}}

<table>
    {{#each stats}}
        <tr>
            <td>{{symbol}}</td>
            {{#each columns}}
                {{#if inArray key currentUser.columnsToShow}}
                    <td>
                        {{!-- the following is what i'm not sure how to do --}}
                        {{stats[key]}}
                    </td>
                {{/if}
            {{/each}}
        </tr>
    {{/each}}
</table>

inArray是我做的一个帮助器,如果在数组中找到键,则返回true,否则返回false。

这就是我期望表格看起来像

A    5    293
B    4    293
C    2    293

编辑:让它工作

{{#if inArray key currentUser.columnsToShow}}
    <td>
        {{returnArrayValueByKeyName key ../../this}}
    </td>
{{/if}}

Handlebars.registerHelper('returnArrayValueByKeyName', function(keyName, array) {
    return array[keyName];
})

1 个答案:

答案 0 :(得分:0)

您可以将列帮助器更改为stats_to_show帮助程序,该辅助程序仅返回所需列的统计信息:

<table>
    {{#each stats}}
        <tr>
            <td>{{symbol}}</td>
            {{#each stats_to_show}}
                <td>
                  {{this}}
                </td>
            {{/each}}
        </tr>
    {{/each}}
</table>

stats_to_show帮助器看起来像这样

Template.stats_table.stats_to_show = function() {
    result = [];
    for (column in currentUser.columnsToShow) {
        // We're using the fact that a single element of stats is bound to
        // `this` when this helper is called.
        result.push(this[column];
    }
    return result;
}

很抱歉,如果我的Javascript语法已关闭。我最近一直在使用Coffeescript。