绑定ngFor的对象的属性名称动态

我的使用情况：我分配对象的数组如下绑定ngFor的对象的属性名称动态

<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，即他应该能够提及用于选项值和标签的选项。以下是香港专业教育学院尝试和没有工作

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

optionvalue & optionlabel在组件字符串所以，现在当我换他们，我可以得到密钥值，反之亦然如下

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

。任何想法如何做到这一点

来源

2016-05-16 Pratik Kelwalkar

您可以使用下列内容：

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

这种方式，我们将利用在你的组件进行配置。

来源

2016-05-16 14:11:49

太棒了！谢谢，还有一件事，即时通讯现在试图根据用户的数据来保存数据，例如''但该方法从未被调用？任何想法为什么 –

不客气！什么是getClubbedOption方法？你的组件之一？ –

基本上我想要做的就是让用户在显示选项时提及所有数据是杵状的。是的'getClubbedOption'是我应该调用的组件的方法。 'getClubbedOption（item：any）：any { console.log（item）; console.log（this.optionlabel）返回“opt”; }' –

绑定ngFor的对象的属性名称动态

回答

相关问题