动态Angular组件中的导入模块和调用方法

问题描述

我创建了一个Angular 7动态组件，该组件使用Angular材质MatDialog来调用另一个组件。这给了我模块'class_2'导入的意外值'MatDialog'。请添加一个@NgModule批注。但是，如果我不添加MatDialog，则会得到：无法解析class_1的所有参数：（？）。

请帮助。谢谢。

动态组件创建：

@ViewChild('vc',{read: ViewContainerRef}) vc: ViewContainerRef;

constructor(private _compiler: Compiler,private _injector: Injector,private _m: NgModuleRef<any>) {
}

ngAfterViewInit() {
  const template = '<span (click)="openDialog()">Click Here</span>';

  const tmpCmp = Component({template: template})(class {
    constructor(private _dialog: MatDialog) {}

    openDialog() {
      this._dialog.open(AnotherComponent,{});
    }
  });

  const tmpModule = NgModule({
    imports: [CommonModule,MatDialog],declarations: [tmpCmp],})(class {
  });

  this._compiler.compileModuleAndAllComponentsAsync(tmpModule)
    .then((factories) => {
      const f = factories.componentFactories[0];
      const cmpRef = this.vc.createComponent(f);
      cmpRef.instance.name = 'dynamic';
    })
}

解决方法

您是否应该在MatDialogModule NgModule数组中导入imports？