如何在entryComponents另一个模块中使用模块中的组件?

时间:2019-03-22 17:50:48

标签: javascript angular ngx-bootstrap-modal

我有ngx-bootstrap模态成分。此模式用于shared文件夹中。我在FirstModalComponent中使用此DashboardModule,例如:

// Dashboard.module.ts
import { FirstModalComponent } from '../../shared/modals/first-modal/first-modal.component';

@NgModule({
  declarations: [
    DashboardComponent
  ],
  imports: [
    CommonModule,
    ReactiveFormsModule,
    RouterModule.forChild(routes),
    SharedModule
  ],
  entryComponents: [
    FirstModalComponent 
  ]
});

如果我想将FirstModalComponent做成模块,该如何在DashboardModule中实现它并在entryComponents中定义它?

import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';

import { FirstModalModule } from './first-modal/first-modal.module';

@NgModule({
  declarations: [],
  imports: [
    CommonModule,
    FirstModalModule
  ],
  exports: [
    CommonModule,
    FirstModalModule
  ]
})
export class ModalsModule { }

然后,我在ModalsModule中导入/导出此SharedModule,并尝试将共享模块导入DashboardModule

现在如何在仪表板中将FirstModalComponent注入entryComponents

当我尝试导入FirstModalComponent并放入entryComponentsComponent is part of the declaration of 2 modules时出现错误。

P.S。我不确定将其作为模块是一个好主意。

1 个答案:

答案 0 :(得分:1)

您应该仅在一个FirstModalComponent中声明module。它可以是一个模块的一部分,并可以由同一模块导出,并且可以将其定义为entryComponent

对于您的情况,将其声明为

entryComponents: [ FirstModalComponent ]

FirstModalModule,并从FirstModalComponent导出FirstModalModule。当您在FirstModalModule或应用程序中的任何其他模块中导入ModalsModule时,它将按预期工作。

请确保FirstModalModuleModalsModule导出了SharedModule,具体取决于您的用途。如果要通过将SharedModule导入到DashboardModule中来使用它,则必须从SharedModule导出。