javascript-为什么angular2表单不能正确使用html元素？

我注意到< form>的某些奇怪行为. ng2中的元素,我需要有人向我解释一下:)

我创建了简单的Plunker示例
https://plnkr.co/edit/vdrHJBNdd26y6YhPXTHD?p=preview

因此,现在是工作的罚款.如果你输入一些值,然后单击“添加参数”,输入值将在模型进行更新,并保存到输入字段.

但是,如果用< form>包裹< div&gt ;,像这样的元素https://plnkr.co/edit/vdrHJBNdd26y6YhPXTHD?p=preview
和输入不便到现场,然后再次单击“添加参数”,表格将被刷新,你的价值就会消失(在它仍然存在模型).无法弄清楚为什么会发生.在此先感谢您的回答.

解决方法:

原因是当表单借助ngFor呈现所有输入时,我们显示所有字段.但是问题是我们对所有具有name =“ name”& name =“ test”.因此,当新输入的名称值添加为“&键入this.types [0](String),它将对所有表单元素应用相同的值.

<form #form="ngForm">
    <div *ngFor="let param of paramsList; let i=index">
      <input type="text" [(ngModel)]="param.name" name="{{'name'+i}}">
      <select [(ngModel)]="param.type" name="{{'type'+i}}">
          <option *ngFor="let type of types" [ngValue]="type">{{type}}</option>
      </select>
    </div>
</form>

Demo Plunkr

Note: Somehow [attr.name]="'name'+i" isn’t working.