Switching Off the Float Label of Our Angular Material Form Field

Photo by Jose Antonio Jiménez Macías on Unsplash

Updated Version

There’s an updated version of this article here:

Switching Off the Float Label of Our Angular Material Form Field

Scenario

We have a material search form field:

<mat-form-field>
<input matInput placeholder="Search">
</mat-form-field>

And we want to turn off the floating label.

Approach

Just add floatLabel='never' .

Brought to You By

Firefly Semantics Supply Chain and Big Data Analytics for the Cloud