当Angular的FormArray不按预期工作时,可能是由于以下一些常见问题引起的:
new FormArray([])
来初始化一个空的FormArray,或者使用this.formBuilder.array([])
来初始化。import { FormArray, FormBuilder, FormGroup, Validators } from '@angular/forms';
// 初始化FormArray
myFormArray: FormArray;
constructor(private formBuilder: FormBuilder) {
this.myFormArray = this.formBuilder.array([]);
}
this.myForm.addControl('myFormArray', this.myFormArray)
将FormArray添加到FormGroup中。import { FormArray, FormBuilder, FormGroup, Validators } from '@angular/forms';
// 初始化FormGroup
myForm: FormGroup;
constructor(private formBuilder: FormBuilder) {
this.myForm = this.formBuilder.group({
myFormArray: this.myFormArray
});
}
this.myFormArray.push(new FormControl(value))
。要从FormArray中删除表单控件,可以使用this.myFormArray.removeAt(index)
。import { FormArray, FormBuilder, FormControl, FormGroup, Validators } from '@angular/forms';
// 添加表单控件到FormArray
addControl() {
this.myFormArray.push(new FormControl(''));
}
// 从FormArray中删除表单控件
removeControl(index: number) {
this.myFormArray.removeAt(index);
}
formArrayName
指令,并使用*ngFor
循环遍历FormArray中的表单控件。
通过检查以上问题,并根据需要进行相应的更改,您应该能够解决Angular的FormArray不按预期工作的问题。