No value accessor for form control

You are adding the formControlName to the label and not the input.

You have this:

<div >  <div class="input-field col s12">    <input id="email" type="email">     <label class="center-align" for="email" formControlName="email">Email</label>  </div></div>

Try using this:

<div >  <div class="input-field col s12">    <input id="email" type="email" formControlName="email">     <label class="center-align" for="email">Email</label>  </div></div>

Update the other input fields as well.

For UnitTest angular 2 with angular material you have to add MatSelectModule module in imports section.

import { MatSelectModule } from '@angular/material';beforeEach(async(() => {    TestBed.configureTestingModule({      declarations: [ CreateUserComponent ],      imports : [ReactiveFormsModule,                MatSelectModule,        MatAutocompleteModule,......      ],      providers: [.........]    })    .compileComponents();  }));

For anyone experiencing this in angular 9+

This issue can also be experienced if you do not declare your component or import the module that declares the component.

Lets consider a situation where you intend to use ng-select but you forget to import it Angular will throw the error 'No value accessor...'

I have reproduced this error in the Below stackblitz demo.