什么导致“control.registerOnChange不是函数”错误 [英] What causes the "control.registerOnChange is not a function" error

问题描述

我有一个使用反应形式方法的表单。这个表格是在我的哈巴狗中创建的：

  form（[formGroup] ='form'，novalidate =''，（ ngSubmit）='postSurvey（form.value，form.valid）'）
  

我尝试在javascript部分中更改表单（这是一个 FormArray ）。我收到以下错误：

 异常：http：// localhost：8080 / app / components / fillForm.template中的错误。 html：0：326引起的：control.registerOnChange不是函数
 core.umd.js：3497 TypeError：control.registerOnChange不是函数
在setUpControl（http：// localhost：8080 / node_modules/@angular/forms/bundles/forms.umd.js：1634：17）eval处的
（http：// localhost：8080/node_modules/@angular/forms/bundles/forms.umd.js：4752 ：25）
在Array.forEach（本地）
在FormGroupDirective._updateDomValue（http：// localhost：8080/node_modules/@angular/forms/bundles/forms.umd.js：4747：29） 
在FormGroupDirective.ngOnChanges（http：// localhost：8080/node_modules/@angular/forms/bundles/forms.umd.js：4616：22）
在Wrapper_FormGroupDirective.ngDoCheck（/ ReactiveFormsModule / FormGroupDirective / wrapper.ngfactory.js：30：18）
 at View_FillFormComponent2.detectChangesInternal（/AppModule/FillFormComponent/component.ngfactory.js:275:32）$ b $ View_FillFormComponent2.AppView.detectChanges（http：// localhost：8080/node_modules/@angular/core/bundles/core.umd.js：12592：18）$ b $在View_FillFormComponent2.DebugAppView.detectChanges（http：/ /localhost:8080/node_modules/@angular/core/bundles/core.umd.js:12739:48）
位于ViewContainer.detectChangesInNestedViews（http：// localhost：8080 / node_modules / @ angular / core / bundles / core.umd.js：12850：41）
 at CompiledTemplate.proxyViewClass.View_FillFormComponent0.detectChangesInternal（/AppModule/FillFormComponent/component.ngfactory.js:64:14）
 at CompiledTemplate.proxyViewClass.AppView.detectChanges （http：// localhost：8080/node_modules/@angular/core/bundles/core.umd.js：12592：18）
在CompiledTemplate.proxyViewClass.DebugAppView.detectChanges（http：// localhost：8080 / node_modules /@angular/core/bundles/core.umd.js:12739:48）
在CompiledTemplate.proxyViewClass.AppView.internalDetectChanges（http：// localhost：8080 / node_modules / @ angular / core / bundles / core。 UMD。 js：12577：22）
 at CompiledTemplate.proxyViewClass.View_FillFormComponent_Host0.detectChangesInternal（/AppModule/FillFormComponent/host.ngfactory.js:29:19）
  

我改变表单的代码非常复杂，我无法简化它或在重新生成时重现它。不仅仅是直接找到解决方案（这些细节太难了），我想了解这个错误的含义是什么？

我发现错误发生在 [formGroup] ='form'在我的HTML。

任何建议都会有所帮助。

解决方案

是的，该错误信息有点含糊不清，但如果您使用 FormBuilder ，当您在组件中向 FormGroup 添加控件并将其命名为时， A，但随后忘记将 formControlName =A的输入添加到您的模板中，或者 formControlName 输入的目标不是 A ，或者为空，或者不存在。

基本上，它表示：我无法将FormGroup中的控件与模板中的控件匹配。

I have a form using the reactive form approach. The form is created as follow in my pug:

form([formGroup]='form', novalidate='', (ngSubmit)='postSurvey(form.value, form.valid)')

Everything works fine except when I try to change the form (which is a FormArray) in the javascript part. I get the following error:

EXCEPTION: Error in http://localhost:8080/app/components/fillForm.template.html:0:326 caused by: control.registerOnChange is not a function
core.umd.js:3497 TypeError: control.registerOnChange is not a function
    at setUpControl (http://localhost:8080/node_modules/@angular/forms/bundles/forms.umd.js:1634:17)
    at eval (http://localhost:8080/node_modules/@angular/forms/bundles/forms.umd.js:4752:25)
    at Array.forEach (native)
    at FormGroupDirective._updateDomValue (http://localhost:8080/node_modules/@angular/forms/bundles/forms.umd.js:4747:29)
    at FormGroupDirective.ngOnChanges (http://localhost:8080/node_modules/@angular/forms/bundles/forms.umd.js:4616:22)
    at Wrapper_FormGroupDirective.ngDoCheck (/ReactiveFormsModule/FormGroupDirective/wrapper.ngfactory.js:30:18)
    at View_FillFormComponent2.detectChangesInternal (/AppModule/FillFormComponent/component.ngfactory.js:275:32)
    at View_FillFormComponent2.AppView.detectChanges (http://localhost:8080/node_modules/@angular/core/bundles/core.umd.js:12592:18)
    at View_FillFormComponent2.DebugAppView.detectChanges (http://localhost:8080/node_modules/@angular/core/bundles/core.umd.js:12739:48)
    at ViewContainer.detectChangesInNestedViews (http://localhost:8080/node_modules/@angular/core/bundles/core.umd.js:12850:41)
    at CompiledTemplate.proxyViewClass.View_FillFormComponent0.detectChangesInternal (/AppModule/FillFormComponent/component.ngfactory.js:64:14)
    at CompiledTemplate.proxyViewClass.AppView.detectChanges (http://localhost:8080/node_modules/@angular/core/bundles/core.umd.js:12592:18)
    at CompiledTemplate.proxyViewClass.DebugAppView.detectChanges (http://localhost:8080/node_modules/@angular/core/bundles/core.umd.js:12739:48)
    at CompiledTemplate.proxyViewClass.AppView.internalDetectChanges (http://localhost:8080/node_modules/@angular/core/bundles/core.umd.js:12577:22)
    at CompiledTemplate.proxyViewClass.View_FillFormComponent_Host0.detectChangesInternal (/AppModule/FillFormComponent/host.ngfactory.js:29:19)

My code to change the form is quite complex and I can't simplify it or reproduce it in a plunker. More than finding directly the solution (it's too difficult with so little details), I would like to understand what this error means? And what might cause this error.

I have figured out that the error occurs at [formGroup]='form' in my HTML.

Any suggestion will help.

解决方案

Yes, that error message is a bit cryptic, but if you use FormBuilder, you would see this when you added a control to FormGroup in your component and named it "A", but then either forgot to add input with formControlName="A" to your template, or formControlName for the intended input is not A, or empty, or not present.

Basically, it says: "I cannot match the control I have in FormGroup to the control in the template".

这篇关于什么导致“control.registerOnChange不是函数”错误的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！