Ngx-admin: Error: Can't bind to 'formGroup' since it isn't a known property of 'form'.

Created on 21 Sep 2016 · 11Comments · Source: akveo/ngx-admin

I am getting below error after update angular 2.0 version and it was work in angular 2.0 RC 5. i have notice that same code working in login components. what i am missing?

polyfills.bundle.js:15347 Unhandled Promise rejection: Template parse errors:
Can't bind to 'formGroup' since it isn't a known property of 'form'. (" raised segment">

][formGroup]="myForm"
(ngSubmit)="onSubmit(myForm.value)"
class="ui form">
"): Bump@2:10
Can't bind to 'formControl' since it isn't a known property of 'input'. ("
id="skuInput"
placeholder="SKU"
[ERROR ->][formControl]="sku">

class="ui error message">"): Bump@12:19
No provider for ControlContainer ("ss="ui raised segment">

[ERROR ->] (ngSubmit)="onSubmit(myForm.value)"
class="ui form">"): Bump@2:4
No provider for NgControl ("ass.error]="!sku.valid && sku.touched">
SKU
[ERROR ->] id="skuInput"
placeholder="SKU"
"): Bump@9:12 ; Zone: angular ; Task: Promise.then ; Value: Error: Template parse errors:(…) Error: Template parse errors:
Can't bind to 'formGroup' since it isn't a known property of 'form'. (" raised segment">

][formGroup]="myForm"
(ngSubmit)="onSubmit(myForm.value)"
class="ui form">
"): Bump@2:10
Can't bind to 'formControl' since it isn't a known property of 'input'. ("
id="skuInput"
placeholder="SKU"
[ERROR ->][formControl]="sku">

Source

jadav1982

👍2

Most helpful comment

Since RC5 you need to import modules to use their directives. Here, you need to import both FormsModule and ReactiveFormsModule from the @angular/forms module. Include them as imports in your NgModule, the one that contains the components that use _ngSubmit_, _formControl_ and _formGroup_.

Gelio on 21 Sep 2016

👍29 😄4

All 11 comments

Gelio on 21 Sep 2016

👍29 😄4

thanks @Gelio

jadav1982 on 22 Sep 2016

Thanks @Gelio

Klerith on 9 Jan 2017

Has this regressed? I am most certainly importing both FormsModule and ReactiveFormsModule in app.module.ts, but I am still getting this error.

paulwalker on 8 Feb 2017

👍8

Ok, my particular issue was that my component was driven by a module. Apparently referencing ReactiveFormsModule was not enough in app.modules.ts, it needed to be referenced in my submodule login.module.ts.

These sort of referencing issues between modules are classic PITA points with angular.

paulwalker on 9 Feb 2017

👍11

I am new to angular 2 however,just tried importing the reactive form, import { FormsModule, ReactiveFormsModule } from '@angular/forms'; in app.module.ts but doesnt seemed to be working getting below error

Uncaught (in promise): Error: Template parse errors:
Can't bind to 'formGroup' since it isn't a known property of 'form'. ("" />

][formGroup]="formGroup">
@7:35
Error: Template parse errors:
Can't bind to 'formGroup' since it isn't a known property of 'form'. ("" />

][formGroup]="formGroup">
LoginComponent@7:35
at SyntaxError.ZoneAwareError (http://localhost:9876/base/src/polyfills.ts:5178:33)
at SyntaxError.BaseError [as constructor] (http://localhost:9876/base/src/test.ts:91208:16)
at new SyntaxError (http://localhost:9876/base/src/test.ts:8389:16)
at TemplateParser.parse (http://localhost:9876/base/src/test.ts:21441:19)
at JitCompiler._compileTemplate (http://localhost:9876/base/src/test.ts:57690:68)
at http://localhost:9876/base/src/test.ts:57573:62
at Set.forEach ()
at JitCompiler._compileComponents (http://localhost:9876/base/src/test.ts:57573:19)
at createResult (http://localhost:9876/base/src/test.ts:57475:19)
at ZoneDelegate.invoke (http://localhost:9876/base/src/polyfills.ts:4520:26)
at AsyncTestZoneSpec.onInvoke (http://localhost:9876/base/src/test.ts:117637:39)
at ProxyZoneSpec.onInvoke (http://localhost:9876/base/src/test.ts:118339:39)
at ZoneDelegate.invoke (http://localhost:9876/base/src/polyfills.ts:4519:32)
at Zone.run (http://localhost:9876/base/src/polyfills.ts:4312:43)
at http://localhost:9876/base/src/polyfills.ts:4899:57

Cynthi23 on 16 Jan 2018

compiler.js?dd9e:485 Uncaught Error: Template parse errors:
Can't bind to 'formGroup' since it isn't a known property of 'form'.

Ukmandal on 1 Feb 2018

still not resolve this error

prasoon-tare on 24 Mar 2018

👍9

you can use shared module to import ReactiveFromsModule and FormsModule which inturns export them and you can imort shared module wherever you want.

rambudha on 26 Sep 2018

HI,
i have imported ReactiveFormsModule in app.module.ts and in the imports array too. But doesn't seem like working , i am getting below error, please help. Thanks

uncaught Error: Template parse errors:
Can't bind to 'FormGroup' since it isn't a known property of 'form'. ("

][FormGroup]="employeeForm" class="form-horizontal">

html@2:8
No provider for ControlContainer ("

[ERROR ->]

"): ng:///AppModule/CreateEmployeeComponent.html@2:2
at syntaxError (compiler.js:2430)
at TemplateParser.push../node_modules/@angular/compiler/fesm5/compiler.js.TemplateParser.parse (compiler.js:20605)
at JitCompiler.push../node_modules/@angular/compiler/fesm5/compiler.js.JitCompiler._parseTemplate (compiler.js:26171)
at JitCompiler.push../node_modules/@angular/compiler/fesm5/compiler.js.JitCompiler._compileTemplate (compiler.js:26158)
at compiler.js:26101

saga-dotcom on 17 May 2019

Since RC5 you need to import modules to use their directives. Here, you need to import both FormsModule and ReactiveFormsModule from the @angular/forms module. Include them as imports in your NgModule, the one that contains the components that use _ngSubmit_, _formControl_ and _formGroup_.

i have tried the same but its not working as expected. please guide

saga-dotcom on 17 May 2019

Was this page helpful?

0 / 5 - 0 ratings