matDatepicker - css style issue

Question

what can i do to get this fixed?

                    <mat-form-field appearance="fill">
                        <mat-label>Choose a date</mat-label>
                        <input matInput [matDatepicker]="picker" formControlName="datebird" >
                        <mat-hint>MM/DD/YYYY</mat-hint>
                        <mat-datepicker-toggle matIconSuffix [for]="picker"></mat-datepicker-toggle>
                        <mat-datepicker touchUi #picker></mat-datepicker>
                    </mat-form-field>

this is the issue

this is what I'm expecting

Answer 1

It’s possible you have a version of material that’s not up to date. Before version 15, use and "matSuffix and not "matIconSuffix"

You can have a look here: https://github.com/angular/components/blob/main/guides/v15-mdc-migration.md