Question

我实际上正在重复一个mat输入字段，然后我用[（ngModel）]的值

将数组中对象的属性名写成[（ngModel）]

例如，这是我拥有的对象数组：

test = [{name: 'Harish'},{name: 'Pushpa'}]

所以在html中我重复了这个数组如下：

 <mat-form-field class="example-full-width" *ngFor="let i of test"> 
<input  matInput placeholder="Favorite food" [(ngModel)]='i.name' name='trtrtrtrt'>


</mat-form-field>

但它显示所有输入字段的值作为数组中最后一个元素的名称

这是我正在解决的问题的工作plunker。

Answer 1

不同的input应具有不同的name属性。

<mat-form-field class="example-full-width" *ngFor="let i of test"> 
    <input  matInput placeholder="Favorite food" [(ngModel)]='i.name' [name]='i.name'>
</mat-form-field>

您可以在plunker

中找到结果

Answer 2

我有一个非常相似的问题（角度7）-无法在堆栈中追溯为什么在其他组件中完全相同的代码可以工作时会发生这种情况。我的双向绑定解决方法是：

  <mat-form-field class="example-full-width" *ngFor="let i of test"> 
    <input matInput placeholder="Favorite food" [value]="i.name"  (input)="i.name = $event.target.value" [name]='i.name'>   
  </mat-form-field>

即使用[值]和（输入）绑定。

Answer 3

试试这个

 <mat-form-field class="example-full-width" *ngFor="let i of test"> 
<input  matInput placeholder="Favorite food" value="{{i.name}}" name='trtrtrtrt'>   
</mat-form-field>

当重复输入字段时，ngModel不起作用，重复数组的对象内的属性在[（ngModel）]

3 个答案: