在 StackBlitz 中出现“this._ngZone is undefined”错误

Posted

技术标签:

【中文标题】在 StackBlitz 中出现“this._ngZone is undefined”错误【英文标题】:Getting 'this._ngZone is undefined' error in StackBlitz 【发布时间】:2021-08-21 17:41:40 【问题描述】:

我正在尝试在 StackBlitz 中运行 Angular 应用程序。它工作正常,直到我尝试添加mat-sidenav-container。然后应用程序开始失败,控制台中显示以下错误:

ERROR Error: this._ngZone is undefined

这里是相关 StackBlitz 的链接:https://stackblitz.com/edit/angular-7cazwh?file=src%2Fapp%2Fapp.component.html

这是 html 代码。如果我注释掉指定的部分,它会起作用。我如何让它工作?谢谢。

<div class="main-div">
  <mat-toolbar color="primary" class="app-header">
    <button mat-icon-button (click)="toggleSidenav()">
      <mat-icon>menu</mat-icon>
    </button>
    <span>Config</span>
    <span class="spacer"></span>
    <button mat-icon-button>
      <mat-icon>account_circle</mat-icon>
    </button>
    <span>Admin</span>
  </mat-toolbar>
  
  <!-- NOTE: the app works when I comment out mat-sidenav-container below -->
  <mat-sidenav-container class="app-sidenav">
    <mat-sidenav #sidenav mode="side" opened="true" class="sidenav" fixedInViewport="false">
      <mat-list>
        <mat-list-item>
          <mat-icon matListIcon>people</mat-icon>Users
        </mat-list-item>
        <mat-list-item>
          <mat-icon matListIcon>devices_other</mat-icon>Devices
        </mat-list-item>
      </mat-list>
    </mat-sidenav>
    <mat-sidenav-content>
      <p style="margin:20px">TODO: mat-sidenav-content</p>
    </mat-sidenav-content>
  </mat-sidenav-container>

</div>

【问题讨论】:

【参考方案1】:

这似乎是 Angular 和 Material 的一个错误,仍然是 unsolved。

mat-sidenav 更改为mat-drawer

【讨论】:

以上是关于在 StackBlitz 中出现“this._ngZone is undefined”错误的主要内容,如果未能解决你的问题,请参考以下文章

StackBlitz ngcc 在启用 Ivy 的情况下无法在我的 npm 库上运行

运行浏览器内开发服务器 [如 stackblitz/codesandbox]

在浏览器中本地运行Node.js

For loop let scope stackblitz vs chrome dev tools

固定汉堡图标角

将 scss 文件添加到 Stackblitz