バインディングngForのオブジェクトの属性名を動的

Question

私のユースケース：私は

<select> 
<option *ngFor="let item of data" [value]="item.key">{{item.value}}</option> 
<select> 

に続き、私のデータは今

[ 
    { 
    "key" : "CHV", 
    "value" : "Chivas" 
    }, 
    { 
    "key" : "BLN", 
    "value" : "Balentines" 
    }, 
    { 
    "key" : "BDG", 
    "value" : "Black Dog" 
    } 
] 

プリティstraigtforward、あるとのngForを使用してオプションを選択するために、オブジェクトの配列を割り当てています 私が欲しいのは、item.keyとitem.valueをユーザーが指定したものにバインドするということです。つまり、valueとlabelのオプションのどちらを使用するかを指定する必要があります。だから今、私はその逆の値としてキーとを取得することができますそれらを交換するとき

optionvalue : string = 'key'; 
optionlabel : string = 'value'; 

を次のようにここにアイブがしようとした

<option *ngFor="let item of data; let itemlabel = optionlabel; let itemvalue = optionvalue" value="{{item.itemvalue}}">{{item.itemlabel}}</option> 

optionvalue & optionlabelを動作しませんでしたどのようなコンポーネント内の文字列されているのです。そう

Answer 1

を行うにはどのように任意のアイデアは、次を使用することができます。

<option *ngFor="let item of data" value="{{item[itemvalue]}}"> 
    {{item[optionlabel]}} 
</option> 

私たちはあなたのコンポーネントで行われた構成を活用します。この道を。