About this question
I am currently engaged in a particular task that is related to working on an angular-based project that includes a form of user registration. For this, I have decided to use the reactive forms to handle form validation and data handling. However, when I am trying to run my angular application and navigate to the registration form, I am receiving an issue message which is stating that it “ cannot bind to ‘formgroup’ since it is not a known property of ‘form’”. How can I troubleshoot and resolve this particular issue? Here is the snippet of my code from my “registration.component.html:
<form [formGroup]=”registrationForm” (ngSubmit)=”onSubmit()”>
<input id=”username” formControlName=”username”>
<button type=”submit”>Register</button>
</form>
And in my “refistration.component.ts”:
Import { Component, OnInit } from ‘@angular/core’;
Import { FormBuilder, FormGroup, Validators } from ‘@angular/forms’;
@Component({
Selector: ‘app-registration’,
templateUrl: ‘./registration.component.html’,
styleUrls: [‘./registration.component.css’]
})
Export class RegistrationComponent implements OnInit {
registrationForm: FormGroup;
constructor(private fb: FormBuilder) {}
ngOnInit(): void {
this.registrationForm = this.fb.group({
userDetails: this.fb.group({
username: [‘’, Validators.required]
})
});
}
onSubmit(): void {
console.log(this.registrationForm.value);
}
}
