mat-form-field must contain a MatFormFieldControl

We are trying to build our own form-field-Components at our Company. We are trying to wrap material design's Components like this:

field:


{{hint}}
{{message.value.length}} / 256
This field is required



textbox:





Usage:



This results in approximately this:




















But I'm getting "mat-form-field must contain a MatFormFieldControl" in the console. I guess this has to do with mat-form-field not directly containing a matInput-field. But it is containing it, it's just withing the ng-content projection.

Here is a blitz:
https://stackblitz.com/edit/angular-xpvwzf

Import MatInputModule in your module.ts file and it will solve the problem.

import { MatInputModule } from '@angular/material/input';

The statement after it is the old answer.

Unfortunately content projection into mat-form-field is not supported yet.
Please track the following github issue to get the latest news about it.

By now the only solution for you is either place your content directly into mat-form-field component or implement a MatFormFieldControl class thus creating a custom form field component.

Stack Overflow Q#46705101, score: 112