Can't bind to 'formGroup' since it isn't a known property of 'form'.
Most comman problem in angular is : 'Can't bind to 'formGroup' since it isn't a known property of 'form'.'
this is because formGroup and formControl directive are provided by angular reactiveform
and probably you did not include this is your's angular app. so first you include this in your's angular app so that this error is gone
so include the reactive form directive in your's app.component.module by following way
and also include the FormGroup and FormControl in your's component.ts
in my case it is create-employee.component.ts
have a look
Most comman problem in angular is : 'Can't bind to 'formGroup' since it isn't a known property of 'form'.'
this is because formGroup and formControl directive are provided by angular reactiveform
and probably you did not include this is your's angular app. so first you include this in your's angular app so that this error is gone
so include the reactive form directive in your's app.component.module by following way
import { ReactiveFormsModule } from "@angular/forms";
and also include this in imports array so your's
app.module.ts would we look like this
import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { ReactiveFormsModule } from "@angular/forms";
import { AppRoutingModule } from './app-routing.module';
import { AppComponent } from './app.component';
import { CreateEmployeeComponent } from './employee/create-employee.component';
import { ListEmployeesComponent } from './employee/list-employees.component';
@NgModule({
declarations: [
AppComponent,
CreateEmployeeComponent,
ListEmployeesComponent
],
imports: [
BrowserModule,
AppRoutingModule
],
providers: [],
bootstrap: [AppComponent]
})
export class AppModule { }
and also include the FormGroup and FormControl in your's component.ts
in my case it is create-employee.component.ts
have a look
import { Component, OnInit } from '@angular/core';
import { FormGroup, FormControl } from "@angular/forms";
@Component({
selector: 'app-create-employee',
templateUrl: './create-employee.component.html',
styleUrls: ['./create-employee.component.css']
})
export class CreateEmployeeComponent implements OnInit {
employeeForm: FormGroup;
constructor() { }
ngOnInit() {
this.employeeForm = new FormGroup({
fullName: new FormControl(),
email: new FormControl()
})
}
onSubmit(): void {
console.log(this.employeeForm.value);
}
}
Now i can hope that your's error should be gone. enjoy......
No comments:
Post a Comment