Question

我正在使用Angular客户端应用程序，并且我已经在该应用程序中使用了Material的一些功能，例如对话框，选择，卡片等。我想我已经安装了所需的一切。现在我做了一个sidenav，我想使用material的sidenav模块，所以我做到了：

<mat-container>
  <mat-content>
    <div (click)="sidenav.toggle()"></div>
    my component html . . .
  </mat-content>
  <mat-sidenav #sidenav>
    <app-sidenav></app-sidenav>
  </mat-sidenav>
</mat-container>

现在，当我导航到该组件时，我得到一个错误：

未捕获（承诺）：TypeError：无法读取未定义的属性“ runOutsideAngular”

在没有该组件的情况下，它可以正常工作...有人知道这可能是什么问题吗？谢谢！

Answer 1

我做了几乎相同的代码，但是将它们更改为如下：

<mat-container> => <mat-drawer-container>
<mat-content> => <mat-drawer-content>
<mat-sidenav #sidenav> => <mat-drawer #drawer>

Answer 2

在Angular Material's Navigation Schematic上运行ng test时遇到了相同的错误：

ng generate @angular/material:material-nav --name <component-name>

我通过将mat-sidenav中的mat-drawer更改为mat-navbar-test.component.html来解决此问题。

Answer 3

我像这样使sidenav正常工作，尝试一下。

<mat-container>
  <mat-content>
    <div (click)="sidenav.toggle()">
		my component html . . .
	</div>
  </mat-content>
  </mat-container>
  <mat-sidenav-container>
    <mat-sidenav #sidenav>
		<app-sidenav></app-sidenav>
	</mat-sidenav>
</mat-sidenav-container>

Answer 4

之前

<mat-sidenav-container *ngIf="currentAdmin && currentAdmin.role" id="nav" >

我遇到了这个问题，并通过删除父项“ mat-sidenav-container”上的* ngIf来解决了该问题

<mat-sidenav-container id="nav" >

Angular Material sidenav错误：无法读取未定义的属性

4 个答案: