Angular binding binding in ngFor

Question

我试图将输入字段值绑定到列表的成员。我使用ngFor为每个成员创建输入字段。问题是，当我将新成员推送到列表中时，模板上的所有输入字段都将变为空白。双向绑定仍然存在，因为当我更改字段值时，列表中的成员值也会更改。我需要的是一种在将新成员推送到列表时保持模板输入字段中的成员值的方法。 这里是我的html代码：

<form action="submit"> 
    <div *ngFor="let member of MyList; let i = index"> 
    <label for="name"> Name: 
     <input type="text" name='name' [(ngModel)] ='MyList[i].name'></label> 
    </div> 
</form> 
<button (click)="addMember()">add parameter</button> 

使用addMember功能只是将一个新成员到列表的末尾，以便模板也发生变化，并增加了新的领域。一切都在开始时找到，但只要我将新成员推送到列表中，所有先前的字段都将变为空，尽管这些成员的名称值并非空白。

Answer 1

由于您使用的是表单，因此每个name都必须是唯一的，才能作为单独的表单字段进行评估。您可以使用索引此：

<input type="text" name='name{{i}}' [(ngModel)] ='MyList[i].name'></label> 

除非你做到这一点，当你推一个新的空场，所有字段，因为它们是作为同一领域进行评估成为空。尽管您使用ngModel，但仍会发生这种情况。