我正在尝试学习Angular中的反应形式。我能够写入所有属性,但麻木,替代,字母和文本。
**COMPONENT.TS**
createForm() {
this.userForm = this.fb.group({
fname: ['', [Validators.required]],
lname: ['', [Validators.required]],
email: ['', [Validators.email, Validators.required]],
facility: ['', [Validators.required]],
position: [''],
test: this.fb.group({
name: [''],
id: [''],
date: [''],
scored: [''],
wrong: [''],
duration: [''],
answers: this.fb.array ([
this.fb.group({
numb: [''],
alts: this.fb.group({
letter: this.fb.array([]),
text: this.fb.array([])
})
})
])
})
})
}
get answerArray() {
return this.userForm.get("answers") as FormArray;
}
**COMPONENT.HTML**
<form [formGroup]="userForm">
<div formGroupName="test">
<div formArrayName="answers">
<div *ngFor="let ans of answerArray.controls; let i = index">
<div [formGroupName]="i">
<input type="text" formControlName="">
</div>
</div>
</div>
</div>
</form>
<pre>{{ userForm.value | json}}</pre>
我收到此错误:core.js:6241错误TypeError:无法读取null的属性'controls'
请任何人可以帮助我。我找到了这个示例,但我无法理解https://stackblitz.com/edit/angular-nested-reactive-form-eg-na1ctu?file=src%2Fapp%2Fapp.component.html
试试这个:
get answerArray() {
return this.userForm.controls['test'].get("answers") as FormArray;
}
要么
get answerArray() {
return this.userForm.get("test.answers") as FormArray;
}
要么
get answerArray() {
return this.userForm.get(["test","answers"]) as FormArray;
}
“答案”位于“测试”内部,这就是其返回未防御状态的原因。
编辑:要访问字母或文本,您可以执行以下操作:您必须为此使用索引才能知道要获取formArray中的哪个formGroup。
get textArray(index: number): FormArray {
return this.answerArray().at(index).get('alts').get('text') as FormArray;
}
本文收集自互联网,转载请注明来源。
如有侵权,请联系[email protected] 删除。
我来说两句