Encountering a problem that seems to have been addressed previously.
Error: Can't bind to 'formGroup' since it isn't a known property of 'form'.
I followed the steps by importing ReactiveFormsModule and FormsModule in the required modules, but the issue persists.
view.html
<form formGroup="siteForm" (ngSubmit)="createNewSite()">
<div class="form-group">
<label>Nom du site</label>
<input type="text" formControlName="siteName" class="form-control" required>
</div>
...
<button type="submit" class="btn btn-primary btn-sm">Envoyer</button>
</form>
site.module.ts
import {NgModule} from '@angular/core';
import {CreateComponent} from './create/create.component';
import {ReadComponent} from './read/read.component';
import {BrowserModule} from "@angular/platform-browser";
import {FormsModule, ReactiveFormsModule} from "@angular/forms";
@NgModule({
declarations: [
CreateComponent,
ReadComponent
],
imports: [
BrowserModule,
FormsModule,
ReactiveFormsModule
]
})
export class SiteModule {
}
create.component.ts
import {Component, OnInit} from '@angular/core';
import {FormBuilder, FormGroup, Validators} from "@angular/forms";
@Component({
selector: 'app-create',
templateUrl: './create.component.html',
styleUrls: ['./create.component.scss']
})
export class CreateComponent implements OnInit {
siteForm!: FormGroup;
constructor(private formBuilder: FormBuilder) {
}
ngOnInit(): void {
this.siteForm = this.formBuilder.group(
{
siteName: ['', [Validators.required]],
siteDescription: ['', [Validators.required]],
siteCreatedOn: ['', [Validators.required]],
siteActive: ['', [Validators.required]]
}
);
}
createNewSite() {
console.log(this.siteForm.value);
}
}
Tried removing and re-adding 'ReactiveFormsModule, FormsModules' from all modules without success. Any other suggestions? Thanks!