角度材料datepicker表现得很奇怪

Question

单击此处查看外观 Angular Material Date Picker的作用很奇怪，当在图标上选择时，日历似乎很大。是否面临此问题。

app.component.html：

<mat-form-field appearance="fill">
   <input matInput [matDatepicker]="myDatePicker">
   <mat-datepicker-toggle matSuffix [for]="myDatePicker"></mat-datepicker-toggle>
   <mat-datepicker #myDatePicker></mat-datepicker>
</mat-form-field>

app.model.ts：

import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';


import { AppRoutingModule } from './app-routing.module';
import { AppComponent } from './app.component';

import {CommonModule} from '@angular/common';
import {FormsModule}    from '@angular/forms';
import {MatFormFieldModule} from '@angular/material/form-field';
import {MatDatepickerModule} from '@angular/material/datepicker';
import {MatNativeDateModule} from '@angular/material/core';
import {MatInputModule} from '@angular/material/input'

// import { MatMomentDateModule } from "@angular/material/moment-adapter";

@NgModule({
  declarations: [
    AppComponent
  ],
  imports: [
    BrowserModule,
    AppRoutingModule,
    CommonModule,
    FormsModule,
    BrowserAnimationsModule,
    MatDatepickerModule,
    MatFormFieldModule,
  MatNativeDateModule,
MatInputModule],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule { }

console 的屏幕截图