角料步进:错误:无法找到名称对照:“formArray”
问题描述:
我试着与设置角料步进这里如何跟进步骤:https://material.angular.io/components/stepper/overview角料步进:错误:无法找到名称对照:“formArray”
我想有多个步骤,使一个简单的单一形式我创造了这个:
<form [formGroup]="formGroup">
<mat-horizontal-stepper formArrayName="formArray" linear>
<mat-step formGroupName="0" [stepControl]="formArray.get([0])">
<div>
<button mat-button matStepperNext type="button">Next</button>
</div>
</mat-step>
<mat-step formGroupName="1" [stepControl]="formArray.get([1])">
<div>
<button mat-button matStepperPrevious type="button">Back</button>
<button mat-button matStepperNext type="button">Next</button>
</div>
</mat-step>
</mat-horizontal-stepper>
</form>
我得到我的控制台上:
ERROR Error: Cannot find control with name: 'formArray'
at _throwError (forms.es5.js:1918)
at setUpFormContainer (forms.es5.js:1891)
at FormGroupDirective.webpackJsonp.../../../forms/@angular/forms.es5.js.FormGroupDirective.addFormArray (forms.es5.js:4849)
at FormArrayName.webpackJsonp.../../../forms/@angular/forms.es5.js.FormArrayName.ngOnInit (forms.es5.js:5134)
at checkAndUpdateDirectiveInline (core.es5.js:10856)
at checkAndUpdateNodeInline (core.es5.js:12364)
at checkAndUpdateNode (core.es5.js:12303)
at debugCheckAndUpdateNode (core.es5.js:13167)
at debugCheckDirectivesFn (core.es5.js:13108)
at Object.eval [as updateDirectives] (MystepperComponent.htm
我测试的完整的源代码是在这里:angular stepper test example on github
我真的已经尽力遵循的文件,但我不明白我需要做什么来解决它......
答
那么,你的ngOnInit
有这样的formgroup定义,
ngOnInit() {
this.formGroup = this._formBuilder.group({
firstCtrl: ['', Validators.required]
});
}
不具有formArray
定义的,所以当你在你的模板是指formArrayName="formArray"
应用程序将期待formArray
控制你的父母formGroup声明formGroup
内名为“formArray”(你的情况,从这些2个作业: - this.formGroup = ...
和<form [formGroup]="formGroup">
)。这解释了你解决你的问题的错误。但是你是否真的需要一个formArray,取决于你想要完成的事情,而且我认为就你的问题而言它并不重要。
此外,您似乎没有使用在您的模板中任何地方定义为firstCtrl
的formControl。所以基本上你在你的组件中定义的反应形式(及其控件)与你的模板中的内容不匹配,除了父窗体组名称formGroup
。
希望它有帮助。
感谢,酷和复杂:)所以我会尝试和完全删除formArray,formGroup所有这些东西,看看它的工作,将更新。 – Jas
删除所有formGroup formArray formArrayName Ctrl和所有看起来工作。谢谢:)只是试图按照例子... – Jas
很酷。快乐学习! – amal