Angular 使用添加和删除选项在ngFor的动态输入中未设置ngModel

Angular 使用添加和删除选项在ngFor的动态输入中未设置ngModel,angular,forms,input,angular-ngmodel,Angular,Forms,Input,Angular Ngmodel,使用Angular 4,我必须创建一个动态输入字段,用户可以在其中添加和删除输入字段 但我遇到了一个问题,同一个ngModel被分配到所有输入字段,并在添加或删除按钮上设置输入字段重置 角度Html代码: 无法找出ngModel设置不正确的原因。这是因为所有输入字段都获得相同的name属性值。为每个输入字段指定唯一的名称 <input type="text" name="field_{{IdxVar}}" placeholder="Name Field" [(ngModel

使用Angular 4,我必须创建一个动态输入字段,用户可以在其中添加和删除输入字段

但我遇到了一个问题,同一个ngModel被分配到所有输入字段,并在添加或删除按钮上设置输入字段重置

角度Html代码:
无法找出ngModel设置不正确的原因。

这是因为所有输入字段都获得相同的name属性值。为每个输入字段指定唯一的名称

<input type="text" name="field_{{IdxVar}}" placeholder="Name Field"
        [(ngModel)]="inputAryVar[IdxVar].nameLbl">
固定的

export class AppComponent  {
  inputAryVar:any

  constructor() { }

  ngOnInit(){ 
  this.inputAryVar=[
    {
      "nameLbl":"Field1"
    },
    {
      "nameLbl":"Field2"
    },
    {
      "nameLbl":"Field3"
    }
  ]
  }

  addDelBtnFnc(itmVar, idxVar)
  {
    if(idxVar==this.inputAryVar.length-1)
    {
      this.inputAryVar.push({
      nameLbl:"Field"+(this.inputAryVar.length+1)
    })
    console.log(this.inputAryVar)
    }
    else
      this.inputAryVar.splice(idxVar,1)
  }

  SubmitFnc(event)
  {
    console.log(this.inputAryVar)
  }
}
<input type="text" name="field_{{IdxVar}}" placeholder="Name Field"
        [(ngModel)]="inputAryVar[IdxVar].nameLbl">