问题是这样的:
我有一个带有嵌套表单组的复杂表单,这是它的“简化”结构:
-> MyForm (formGroup)
-> Whatever01 (formControl - input)
-> Whatever02 (formControl - input)
-> WhateverGroup01 (formGroup)
-> Whatever03 (formControl - input)
-> Whatever04 (formControl - input)
-> WhateverArray01 (formArray)
-> WhateverGroup02 (formGroup)
-> Whatever05 (formControl - input)
-> WhateverGroup03 (formGroup)
-> Whatever06 (formControl - input)
-> WhateverGroup04 (formGroup)
-> Whatever07 (formControl - input)
-> ...
角度方面,它应该看起来像这样(不正确/完整,但只是为了给出一个想法):
this.myForm = this.fb.group({
whatever01: ['',Validators.compose([...])],
whatever02: ['',Validators.compose([...])],
whateverGroup01: this._formBuilder.group({
whatever03: ['',Validators.compose([...])],
whatever04: ['',Validators.compose([...])]
}),
whateverArray01: this._formBuilder.array([
this._formBuilder.group({
whatever05: ['',Validators.compose([...])],
whateverGroup03: this._formBuilder.group({
whatever06: ['',Validators.compose([...])]
})
}),
this._formBuilder.group({
whatever07: ['',Validators.compose([...])],
})
])
...
});
从 root myForm 项目到获取 formArray,事情进展顺利,但随之而来的麻烦......
所以,我只是无法访问“whatever05”(和 06,但 05 不起作用......所以......) formControl 将其绑定到模板!这是模板的实际样子(故意跳过数组之前的部分),有趣的部分是 [????]="????",这实际上是问题所在。
<form [formGroup]="myForm" ...>
<!-- ...skipped... -->
<div formArrayName="whateverArray01" *ngFor="let item of myForm.controls.whateverGroup01.controls.whateverArray01.controls;let idx = index;" [formGroupName]="idx">
<div [????]="????">
<input formControlName="whatever05" ... />
<div [????]="????">
<input formControlName="whatever06" ... />
</div>
</div>
</div>
</form>
位于formArray 中的formGroup 都具有相同的结构。
基本上,问题是我无法访问 formGroups 中的 formControls ...
我尝试了几种解决方案,我使用了 [formGroupName] , formGroupName (不带括号), [formGroup], formControlName ,...但无法弄清楚我必须使用什么才能将相应的 formGroup/formControl 与数据绑定!
我现在遇到了这种错误:
formGroup expects a FormGroup instance. Please pass one in.
// This when using [formGroup]="item.whateverGroup02"
Cannot find control with name: 'whatever05'
// When using [formGroup]="item.controls.whateverGroup02"
Cannot find control with path: 'whateverArray01 -> 0 ->'
// This when using [formGroupName]="whateverGroup02"
感谢您的阅读/帮助
这是一个带有一些代码的笨蛋:
http://plnkr.co/edit/wf7fcHMkhIwzmLWLnCF8?p=preview