javascript - 尽管我的组件已在我的模块的 entryComponents 选项中声明，但 Angular 如何找不到该组件的组件工厂？

Question

我想在 ngx-bootstrap's modal 中显示一个组件但我怎样才能动态创建它呢？

我尝试在 RegMktRiskHomeModule 的 entryComponents 选项中声明该组件，但它也不起作用。我目前找到的唯一方法是在 AppModule 中声明 ScenariosGraphComponent，就像我在 RegMktRiskCommonModule 中所做的那样。

这是否与 RegMktRiskHomeModule 导入到 HomeModule 中并且该 HomeModule 由应用程序延迟加载这一事实有关？

这是我的代码(大致):

reg-mkt-risk-common.module.ts:

@NgModule({
    declarations: [
        ScenariosGraphComponent
    ],
    entryComponents: [
        ScenariosGraphComponent
    ],
    exports: [
        ScenariosGraphComponent
    ],
    schemas: [CUSTOM_ELEMENTS_SCHEMA]
})
export class RegMktRiskCommonModule { }

reg-mkt-risk-home.module.ts:

@NgModule({
    declarations: [
        RegulatoryMarketRiskHomeComponent,
        OverviewGridComponent // <-- component who actually show ScenariosGraphComponent in a modal
    ],
    exports: [
        RegulatoryMarketRiskHomeComponent
    ],
    imports: [
        // ...,
        RegMktRiskCommonModule
    ],
    providers: [
        // ...
    ]
})
export class RegMktRiskHomeModule { }

这是实际的错误消息:

ERROR Error: No component factory found for ScenariosGraphComponent. Did you add it to @NgModule.entryComponents?
    at noComponentFactoryError (core.js:9659)
    at CodegenComponentFactoryResolver.push../node_modules/@angular/core/fesm5/core.js.CodegenComponentFactoryResolver.resolveComponentFactory (core.js:9697)
    at ComponentLoader.push../node_modules/ngx-bootstrap/component-loader/fesm5/ngx-bootstrap-component-loader.js.ComponentLoader._getContentRef (ngx-bootstrap-component-loader.js:411)
    at ComponentLoader.push../node_modules/ngx-bootstrap/component-loader/fesm5/ngx-bootstrap-component-loader.js.ComponentLoader.show (ngx-bootstrap-component-loader.js:152)
    at BsModalService.push../node_modules/ngx-bootstrap/modal/fesm5/ngx-bootstrap-modal.js.BsModalService._showModal (ngx-bootstrap-modal.js:927)
    at BsModalService.push../node_modules/ngx-bootstrap/modal/fesm5/ngx-bootstrap-modal.js.BsModalService.show (ngx-bootstrap-modal.js:853)
    at Object.action (overview-grid.options.ts:48)
    at MenuItemComponent.push../node_modules/ag-grid-enterprise/dist/lib/menu/menuItemComponent.js.MenuItemComponent.onOptionSelected (menuItemComponent.js:102)
    at ZoneDelegate.push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invokeTask (zone.js:421)
    at Object.onInvokeTask (core.js:16147)

Answer 1

也许您忘记在打开对话框的组件的模块中导入MatDialogModule。在这种情况下 Angular 生成的错误可能会产生误导。