获取Form Array中的第0个元素FormControl，angular8

Question

我有一个简单的反应形式

this.orderForm = this._formBuilder.group({
vlanFormGroup: this._formBuilder.group({
vlanId: ['', [Validators.required, Validators.pattern(this.positiveInteger)]],
vlanName: ['', [Validators.required, Validators.pattern(this.vlanNamePattern)]],
addVlanToTrunk: [''],
trunkInterfaces: this._formBuilder.array([
this.createAddVlanToTrunkMember()
])
})

createAddVlanToTrunkMember(): FormGroup {
return this._formBuilder.group({
trunkInterface: [''],
allowedVlansOnTrunk: ['']
});
}
get trunkInterfaces(): FormArray {
return this.vlanFormGroup.get('trunkInterfaces') as FormArray;
}

get vlanFormGroup(): FormGroup {
return this.orderForm.get("vlanFormGroup") as FormGroup;
}

我使用ts添加了一个新的formControl数组。现在我想访问trunkInterfaces表单控件数组中的第一行，并获取其表单控件及其值。我试过component.trunkInterfaces[0].get('trunkInterface'))，但不起作用。请帮助

Answer 1

您需要访问表单数组controls属性：

component.trunkInterfaces.controls[0].get('trunkInterface'));

演示：https://stackblitz.com/edit/angular-czfuhm(打开控制台(