角度6材质StaticInjectorError NgZone

Question

从Angular 5迁移到Angular 6之后，我所有的Material组件都不再起作用-再次... ...但是这次我真的不知道是什么会引起问题了。我花了半天时间进行调查，并创建了一个精简项目，以便从本质上重现该问题。

让我向您展示各种文件内容：

package.json

 {
  "name": "xxx",
  "version": "0.0.0",
  "license": "MIT",
  "scripts": {
    "ng": "ng",
    "start": "ng serve",
    "build": "ng build",
    "test": "ng test",
    "lint": "ng lint",
    "e2e": "ng e2e"
  },
  "private": true,
  "dependencies": {
    "@angular/animations": "^6.0.9",
    "@angular/cdk": "^6.4.0",
    "@angular/common": "^6.0.9",
    "@angular/compiler": "^6.0.9",
    "@angular/core": "^6.0.9",
    "@angular/forms": "^6.0.9",
    "@angular/http": "^6.0.9",
    "@angular/material": "^6.4.0",
    "@angular/platform-browser": "^6.0.9",
    "@angular/platform-browser-dynamic": "^6.0.9",
    "@angular/platform-server": "^6.0.9",
    "@angular/router": "^6.0.9",
    "@ngtools/webpack": "1.8.0",
    "@types/node": "~6.0.60",
    "@types/webpack-env": "1.13.0",
    "angular2-template-loader": "0.6.2",
    "aspnet-prerendering": "^3.0.1",
    "aspnet-webpack": "^2.0.1",
    "awesome-typescript-loader": "3.2.1",
    "codelyzer": "~3.2.0",
    "css": "2.2.1",
    "css-loader": "0.28.4",
    "es6-shim": "0.35.3",
    "event-source-polyfill": "0.0.9",
    "expose-loader": "0.7.3",
    "extract-text-webpack-plugin": "2.1.2",
    "file-loader": "0.11.2",
    "html-loader": "0.4.5",
    "isomorphic-fetch": "2.2.1",
    "jquery": "3.2.1",
    "json-loader": "0.5.4",
    "preboot": "4.5.2",
    "protractor": "~5.1.2",
    "raw-loader": "0.5.1",
    "reflect-metadata": "0.1.10",
    "rxjs": "^6.2.2",
    "style-loader": "0.18.2",
    "to-string-loader": "1.1.5",
    "ts-node": "~3.2.0",
    "tslint": "~5.7.0",
    "typescript": "~2.7.2",
    "url-loader": "0.5.9",
    "webpack": "2.5.1",
    "webpack-hot-middleware": "2.18.2",
    "webpack-merge": "4.1.0",
    "zone.js": "^0.8.26"
  },
  "devDependencies": {
    "@angular/cli": "^6.0.8",
    "@angular/compiler-cli": "^6.0.9",
    "@angular/language-service": "^6.0.9",
    "@types/node": "~6.0.60",
    "codelyzer": "~3.2.0",
    "protractor": "~5.1.2",
    "ts-node": "~3.2.0",
    "tslint": "~5.7.0"
  }
}

app.module

import { NgModule } from '@angular/core';
import { MatDialogModule } from '@angular/material';
import { CommonModule } from '@angular/common';
import { RouterModule } from '@angular/router';

import { AppComponent } from './components/app/app.component';
import { MessageFormComponent } from './components/common/forms/message.component';

@NgModule({
  declarations: [
    AppComponent,
    MessageFormComponent,
  ],
  imports: [
    CommonModule,
    MatDialogModule,
    RouterModule.forRoot([
      { path: '', redirectTo: 'home', pathMatch: 'full' },
      { path: 'home', component: MessageFormComponent },
      { path: '**', redirectTo: 'home' }
    ]),
  ]
})
export class AppModuleShared {
}

message.component.ts

从“ @ angular / core”导入{组件}； 从'@ angular / material'导入{MatDialog，MAT_DIALOG_DATA};

@Component({
  selector: 'message-form',
  template: 'blubb',
})
export class MessageFormComponent {
  constructor(private alert: MatDialog) { } // this line causes the problem
}

我对材料进行任何处理后，都会发生此错误。我擅长编写角度程序-不擅长使用NEVER WORKING基础架构...;-）