Angular 使用添加和删除选项在ngFor的动态输入中未设置ngModel
使用Angular 4,我必须创建一个动态输入字段,用户可以在其中添加和删除输入字段 但我遇到了一个问题,同一个ngModel被分配到所有输入字段,并在添加或删除按钮上设置输入字段重置 角度Html代码: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
无法找出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">