无法绑定到“shouldLabelFloat”，因为它不是“input”的已知属性

Question

Based on the api documentation , shouldLabelFloat is a property of MatInput . But I'm still getting the error.

<mat-form-field>
  <input matInput [shouldLabelFloat]="true" placeholder="First Name">
</mat-form-field>

Answer 1

After a bit of digging, it looks like the documentation site is a bit broken and shows properties that are meant to be private. There's currently a pull request that was already merged with this fix to remove private getters. Here's the code for more info.

---

Anyways, the correct property to use is the floatLabel input of MatFormField as follows:

<mat-form-field floatLabel="always">
  <input matInput [(ngModel)]="firstName" placeholder="First name">
</mat-form-field>

The floatLabel input accepts three properties: auto , always or never .

---

Here's some references:

• Api documentation for MatFormField
• Overview docs on placeholders
• Stackblitz Demo

Answer 2

You should user inside mat-form-field

 <mat-form-field shouldLabelFloat="true">
  <input  matInput type="text" [(ngModel)]="firstName"  placeholder="First Name">