ハンドルバーテンプレートでオブジェクトのブラケット記法を使用するにはどうすればいいですか？

Question

ルートテンプレート属性からemberjsコンポーネントを作成していますが、テンプレートに表示する値を渡しています。しかし、私はオブジェクトのブラケット記法によってコンポーネントテンプレートの中でそれにアクセスすることができません。

//route.hbs 
{{b-select 
    options=model.names 
    valueProp='name' 
}} 

モデル

import Ember from 'ember'; 

export default Ember.Route.extend({ 
    model() { 
     return Ember.RSVP.hash({ 
      names: [{name: 'abc'}, {name: 'xyz'}] 
     }); 
    } 

}); 

成分b-選択HBSファイル

<select class="form-control" multiple={{multiple}}> 
    {{#each options as |option|}} 
    <option value="{{option}}">{{option[valueProp]}}</option> 
    {{/each}} 
</select> 

私はoption.nameの代わりoption[valueProp]を使用する場合、それは完璧に動作します。どのように私は動的に選択するためにプロパティを渡すことができますか？なぜブラケット表記は

コンポーネントJSファイルを動作していない

import Ember from 'ember'; 
import fallbackIfUndefined from '../utils/computed-fallback-if-undefined'; 

export default Ember.Component.extend({ 
    multiple: fallbackIfUndefined(false), 
    options: fallbackIfUndefined(null), 
    valueProp: fallbackIfUndefined(0), 
    actions: { 

    }, 
    didInsertElement() { 
     //initialize jquery functions 
     this.$('select').selectpicker({size: 6}); 
    }, 
    willDestroyElement() { 
     //remove all events 
    } 
}); 

私は取得していますエラーが

エラーです： ... ALUE = "{{オプション：3行目でエラーを解析します}} "> {{option [valueProp]}} < -----------------------^ 'ID'、 'STRING'、 'NUMBER '、' BOOLEAN '、' UNDEFINED '、' NULL '、' DATA '、' INVALID '

Answer 1

あなたは{{get}}ヘルパーを使用することができます。

<option value="{{option}}">{{get option valueProp}}</option>

Answer 2

あなたはハンドル・ルックアップ・ヘルパーを使用することができます

：

http://handlebarsjs.com/builtin_helpers.html#lookup

はこれを試してみてください：

<option value="{{option}}">{{lookup option valueProp}}</option>