如何在车把中使用另一个变量指定对象键

Question

From an Ember template I'm trying to get an objects value using a variable for the key. How would I do this?

I've Tried the Following:

<table>
    {{#each record in model}}
    <tr>
        {{#each col in table.cols}}
            <td>{{record[col.field]}}</td>
        {{/each}}
    </tr>
    {{/each}}
</table>

Variables:

var table = {           
   cols: [{
        header: 'Date/Time',
        field: 'date'
    },{
        header: 'Address',
        field: 'address'
    },{
        header: 'Type',
        field: 'type'
    }]
};

var model = [{
    id: 1,
    date: '8/18/85',
    address: '123 abc st',
    type: 'Unique'
}, {
    id: 2,
    date: '9/8/95',
    address: '123 abc st',
    type:'Foreign'
}]

On build I'm getting the following error

Parse error on line 25: ...} {{record[col.field]}} ----------------------^ Expecting 'STRING', 'NUMBER', 'ID', 'DATA', got 'INVALID' Error: Parse error on line 25: ...} {{record[col.field]}} ----------------------^ Expecting 'STRING', 'NUMBER', 'ID', 'DATA', got 'INVALID'

Answer 1

I don't know of a built in way, but you can create a template helper to do this for you.

Something like this:

Ember.Handlebars.helper('array-value', function(array, key, options) {
  return array[key];
});

And in your template you would call:

{{ array-value record col.field }}

Here is a jsbin example