【问题标题】:Unexpected value 'MatDialogRef' imported by the module 'AppModule'. Please add a @NgModule annotation模块“AppModule”导入的意外值“MatDialogRef”。请添加@NgModule 注释
【发布时间】:2018-01-17 07:01:39
【问题描述】:

我正在尝试将 Angular Material 集成到 Angular 中,但出现以下错误。程序编译成功,但在浏览器中出现此问题。

Uncaught Error: Unexpected value 'MatDialogRef' imported by the module 'AppModule'. Please add a @NgModule annotation.
    at syntaxError (compiler.js:485)
    at eval (compiler.js:15226)
    at Array.forEach (<anonymous>)
    at CompileMetadataResolver.getNgModuleMetadata (compiler.js:15201)
    at JitCompiler._loadModules (compiler.js:34385)
    at JitCompiler._compileModuleAndComponents (compiler.js:34346)
    at JitCompiler.compileModuleAsync (compiler.js:34240)
    at CompilerImpl.compileModuleAsync (platform-browser-dynamic.js:239)
    at PlatformRef.bootstrapModule (core.js:5551)
    at eval (main.ts:11)

我在 app.module.ts 中导入了 MatDialogRef

import { MatDialogModule, MatDialogRef } from '@angular/material/dialog';

imports: [
    BrowserModule,
    FormsModule,
    BrowserAnimationsModule,
    MatButtonModule,
    MatDialogModule,
    MatDialogRef,
    ReactiveFormsModule,
    HttpModule,
    HttpClientModule,
    AppRoutingModule
  ],

我也在保存对话框html的组件中导入了。

import { MatDialogRef, MAT_DIALOG_DATA } from '@angular/material';

导出类 ComposeMailComponent 实现 OnInit {

constructor(private dialogRef: MatDialogRef<ComposeMailComponent>,
      @Inject(MAT_DIALOG_DATA) private data) {}

  ngOnInit() {
  }
}

【问题讨论】:

  • 您找到可行的解决方案了吗?
  • 和你一样的问题:错误错误:未捕获(承诺中):错误:StaticInjectorError(AppModule)[MyComponent -> MatDialogRef]:StaticInjectorError(平台:核心)[MyComponent -> MatDialogRef]:NullInjectorError: MatDialogRef 没有提供者!错误:StaticInjectorError(AppModule)[MyComponent -> MatDialogRef]: 你找到解决方案了吗?

标签: angular typescript material-design angular-material angular-material2


【解决方案1】:

你不需要在app.module.ts中导入MatDialogRef,改变

来自

import { MatDialogModule, MatDialogRef } from '@angular/material/dialog';

到

import { MatDialogModule} from '@angular/material';

并从 imports 数组中删除 MatDialogRef

【讨论】:

  • 我已经尝试过了,但是没有用,但是我已经将它改回@angular/material。它仍然给出同样的错误
  • @D555 你删除 matdialogref 了吗?
  • 是的,刚刚做了.. 但它给出了新的错误:错误错误:未捕获(承诺):错误:StaticInjectorError(AppModule)[ComposeMailComponent -> MatDialogRef]
  • MatDialogRef 应该被注入到将要打开的组件的构造函数中
  • 如果他使用像this.dialog.open(ComposeMailComponent 这样的组件,那么它应该可以工作,因为这个提供者是动态创建的
【解决方案2】:

将这些添加到 app.module.ts 文件中

从“@angular/material”导入 { MatDialogModule};

进口:[ MatDialog模块 ],

它会正常工作

【讨论】:

    猜你喜欢
    • 2018-01-10
    • 2019-12-01
    • 2021-09-02
    • 2020-04-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多