除非设置了内容高度，否则不会显示Angular mat-sidenav

Question

我试图让material侧边栏打开两个多小时，结果发现，如果没有在sidenav-content上设置高度，那么侧边栏根本就不会打开。我的目标是让侧边栏的高度总是在左侧，而不是内容所具有的相同高度。40vh的现状：SideNav not full height

有没有人知道为什么会这样，或者我的sidenav-content应该是与现在不同的东西？

    <app-header (toggleSidenav)="navigationSidenav.toggle()"></app-header>
    <mat-sidenav-container autosize="true">
      <mat-sidenav #navigationSidenav [fixedInViewport]="false">
        <mat-nav-list>
          <a mat-list-item [routerLink]="'/accounts'"> Accounts </a>
          <a mat-list-item [routerLink]="'/create-account'"> Create Account </a>
          <a mat-list-item [routerLink]="'/contacts'"> Contacts </a>
          <a mat-list-item [routerLink]="'/create-contact'"> Create Contact </a>
          <a mat-list-item [routerLink]="'/activities'"> Activities </a>
          <a mat-list-item [routerLink]="'/create-activity'"> Create Activity </a>
          <a mat-list-item (click)="navigationSidenav.toggle()">Close</a>
        </mat-nav-list>
      </mat-sidenav>
      <mat-sidenav-content>
        <div style="height: 40vh;">
          <router-outlet></router-outlet>
        </div>
      </mat-sidenav-content>
    </mat-sidenav-container>

应用标头如下所示

<mat-toolbar color="primary">
 <mat-toolbar-row>
    <button mat-icon-button (click)="toggleSidenav.emit()">
        <mat-icon>menu</mat-icon>
    </button>
  </mat-toolbar-row>
</mat-toolbar>

Answer 1

官方文档：

默认情况下，<mat-sidenav>将适合其内容的大小。

因此，您应该显式地告诉组件期望的高度是多少。