mat-form-field must contain a MatFormFieldControl

I had this issue. I imported MatFormFieldModule at my main module, but forgot to add MatInputModule to the imports array, like so:

import { MatFormFieldModule, MatInputModule } from '@angular/material';

@NgModule({
    imports: [
        MatFormFieldModule,
        MatInputModule
    ]
})
export class AppModule { }

More info here.

Problem 1: MatInputModule Not imported

import MatInputModule and MatFormFieldModule inside module i.e. app.module.ts

import { MatInputModule } from '@angular/material/input';
import { MatFormFieldModule } from "@angular/material/form-field";

@NgModule({
    imports: [
        MatFormFieldModule,
        MatInputModule
    ]
})
export class AppModule { }

Problem 2: matInput - spellings mistake / forget to add

Be sure to add matInput and it is case-sensitive.

<mat-form-field>
    <input matInput type="text" />
</mat-form-field>

Problem 3: Invalid *ngIf placement

Check that you don't have any condition on input tag that is going to be false in any case because mat-form-field looks for matInput inside it. Instead put *ngIf on mat-form-field tag.

<mat-form-field>
   <input matInput *ngIf="someCondition"> // don't add condition here, else add in mat-form-field tag
</mat-form-field>

credit to @William Herrmann for pointing out this problem#3

Problem 4: Still compiler giving ERROR

if angular compiler still giving error after fixing above given problems then you must try with restarting the app.

ng serve