如何从mat-datepicker中删除输入字段并只显示图标

Question

我只想删除输入字段，只显示日历图标。

我怎么才能做到这一点呢？

<div style="text-align:center">
    <input matInput [matDatepicker]="dp3" disabled>
    <mat-datepicker-toggle matSuffix [for]="dp3"></mat-datepicker-toggle>
    <mat-datepicker #dp3 disabled="false"></mat-datepicker>
    <mat-label>View Calendar</mat-label>
</div>

Answer 1

只需使用“垫子菜单”即可。在里面你可以放一个垫子日历。使用选定的and (selectedChange)为变量赋值

<button mat-icon-button [matMenuTriggerFor]="appMenu">
<mat-icon>calendar_today</mat-icon>
</button>
<mat-menu #appMenu="matMenu" >
      <mat-calendar style="width:15rem"  #calendar [selected]="date"
          (selectedChange)="date=$event">
      </mat-calendar>
</mat-menu>