当侧面导航在有角材质中打开时如何添加侧面导航切换图标

Question

如何在sidenav打开时显示sidenav切换图标侧面导航切换图标仅显示小屏幕。当前侧面导航打开，当我关闭侧面导航时，侧面导航切换图标消失，显示宽度中等。

我添加了图标，但是它不起作用

<mat-sidenav-container class="sidenav-container">
  <mat-sidenav #drawer class="sidenav" fixedInViewport
      [attr.role]="(isHandset$ | async) ? 'dialog' : 'navigation'"
      [mode]="(isHandset$ | async) ? 'over' : 'side'"
      [opened]="(isHandset$ | async) === false">
    <mat-toolbar>
        <button mat-icon-button  (click)="drawer.toggle()" >
            <mat-icon>menu</mat-icon>
          </button>
    </mat-toolbar>
    <mat-nav-list>
      <a mat-list-item href="#">DashBoard</a>
      <a mat-list-item href="#">Ports</a>
      <a mat-list-item href="#">Berth</a>
    </mat-nav-list>
  </mat-sidenav>
  <mat-sidenav-content>
    <mat-toolbar color="primary">
      <button
        type="button"
        aria-label="Toggle sidenav"
        mat-icon-button
        (click)="drawer.toggle()"
        *ngIf="isHandset$ | async"
        >
        <mat-icon aria-label="Side nav toggle icon">menu</mat-icon>
      </button>
      <span>ESAAR</span>
    </mat-toolbar>
   <app-vessel-details></app-vessel-details>
  </mat-sidenav-content>
</mat-sidenav-container>

对于中等宽度的屏幕，应打开侧面导航。