几个星期前我开始学习Angular 6，所以我还是新手 .
我一直在尝试更新对象数组中的双向绑定字段 .
这是我的数组初始化
store.component.ts ：
store_list = [{
Address1: 'add1',
Address2: 'test',
City: ''
},{Address1: 'aaaa',
Address2: 'bbbb',
City: 'cccc'}];
trackStore(index: number, obj: any): any {
return index;
}
store.component.html:
<div *ngFor="let store of store_list; let i=index; trackBy: trackStore;">
<mat-card class="store-card" mat-elevation-z8>
<mat-card-content>
<form class="example-form">
<mat-form-field class="address-street">
<input matInput [(ngModel)]="store_list[i].Address1" placeholder="Street Address" name="store.{{i}}.address1" required>
</mat-form-field>
<mat-form-field class="address-street">
<input matInput [(ngModel)]="store.Address2" placeholder="Address Line 2" name="store.{{i}}.address2" required>
</mat-form-field>
</form>
</mat-card-content>
</mat-card>
</div>
我尝试将两种不同的方法绑定到ngModel，看看是否有效 . 尽管如此，它们的行为方式相同 .
当我有一个包含3个存储的数组并在任何一个存储上更新地址1或地址2时，所有3个存储地址1字段都会更新 .
大多数在线研究产生了3个解决方案，到目前为止还没有一个解决方案 .
-
在"name"属性中包含索引以具有唯一的字段名称 .
-
使用trackBy，我也尝试在store_list数组中使用唯一的id并通过自定义trackBy函数返回它并且它不起作用 .
-
不要在ngFor中使用ngModel .
1 回答
尝试使用for循环并删除内部跟踪* ngFor：
<input matInput [(ngModel)]="store.Address1" placeholder="Street Address" required>因为[（ngModel）]包含name属性本身 . 请参阅此处的文档：（angular.io/api/forms/NgModel）