Getting Error: formGroup expects a FormGroup instance. Please pass one in

Please double check your component code. What I noticed is that the variable you defined there is different to the one specified in your template.

You should change the reference of sigupForm to signupForm instead.


In my case, I was using Reactive Forms and loading the data for form asynchronously from a service. But, the form template will start getting generated parallelly. And at that time form would be undefined as it would be built only after the data from API call was received. So, first, check if the form is initialized, then only start generating the template.

<form class="col-sm-12 form-content" *ngIf="form" [formGroup]="form">

formGroup expects a FormGroup instance means that you did not create an instance for the FormGroup defined in your template which is signupForm

so you have to create an instance for signupForm like this:

this.signupForm = new FormGroup({
  // form controls
  // arg1 - intial state/value of this control
  // arg2 - single validator or an array of validators
  // arg3 - async validators
  'username': new FormControl(null),
  'email': new FormControl(null),
  'gender': new FormControl('male')
});