[英]Set a dynamic property in ngModel inside ngFor, with Angular 2
I have a component with : 我有一个组件:
Example : 范例 :
selectedData = { Label:"test", IsUsed:false}
fields = [{name:'label', type:'string'},{name:'IsUsed, type:'boolean'}
I am trying to generate a form for editing the data inside 'selectedData' 我正在尝试生成一个表格,用于编辑“ selectedData”中的数据
Here is the part of my view : 这是我观点的一部分:
<div class="ui-grid-row" *ngFor="let myField of fields" >
<div class="ui-grid-col-4"><label for="{{myField.name}}">{{myField.name}}</label></div>
<div class="ui-grid-col-8"><input pInputText id="{{myField.name}}" [(ngModel)]="this['selectedData.' + myField.name]" /></div>
</div>
The problem is with this line 问题是这条线
[(ngModel)]="this['selectedData.' + myField.name]"
It does not work as I wanted. 它不能按我的要求工作。 Here is the Google Chrome watch of my component when i edit :
这是我编辑时组件的Google Chrome浏览器手表:
As you can see, Angular2 creates an object with name "selectedData.Label" instead of using the selectedData existing object. 如您所见,Angular2创建一个名称为“ selectedData.Label”的对象,而不是使用selectedData现有对象。
Is there a solution? 有解决方案吗? Or should I do it differently?
还是我应该另辟do径?
Thx 谢谢
The answer was easy : 答案很简单:
[(ngModel)]="selectedData[myField.name]"
If field.Name has a value of 'label', the previous code is equivalent as : 如果field.Name的值为'label',则先前的代码等效于:
[(ngModel)]="selectedData.label"
I did not know that the '[ ]' could be used this way. 我不知道'[]'是否可以这样使用。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.