在子模块中使用来自导入模块的组件

xze*_*gga 4 angular-module angular-components angular

我有一个导出组件以将其公开给其他模块的模块,我想在作为另一个模块的子模块的模块中使用此组件,我正在导入父模块中的第一个模块以启用子模块内部但是,我我并不完全相信这是最好的方法。

这是我在根文件夹中的共享模块,其中包含我要使用的组件:

应用程序/共享/shared.module.ts

import {dtComponent} from './dt.component';

@NgModule({
  imports: [
    CommonModule
  ],
  exports: [
    dtComponent
  ],
  declarations: [
    dtComponent
  ]
})
export class DatePModule{ }
Run Code Online (Sandbox Code Playgroud)

我在 app 文件夹中有另一个模块,它像这样导入DatePModule

应用程序/联系人/contacts.module.ts

import {DatePModule} from '../shared/shared.module.ts';

@NgModule({
  imports: [
    CommonModule,
    DatePModule
  ]
})
export class CTModule{ }
Run Code Online (Sandbox Code Playgroud)

我需要使用dtComponent直接的一些组件CTModule,还需要在在的子模块等组件此组件CTModule

我可以在CTModule的子模块中再次导入DatePModule,但我不相信这是最好的方法。

应用程序/联系人/其他/other.module.ts

import {DatePModule} from '../../shared/shared.module.ts';

@NgModule({
  imports: [
    CommonModule,
    DatePModule
  ]
})
export class OtherModule{ }
Run Code Online (Sandbox Code Playgroud)

我的问题是,如果DatePModule已经导入到父模块中,为什么我需要再次导入?如果我在OtherModule 中删除此导入,则组件dtComponent不会被识别为模块的一部分。

Max*_*kyi 6

为什么我需要再次导入 DatePModule 如果已经在父模块中导入

相互导入的模块之间没有层次结构。所有模块与所有组件合并为一个模块定义工厂。如果您使用延迟加载,仍然适用。延迟加载模块和共享模块将被合并,它们之间将没有层次结构。

要了解更多信息,请阅读避免与 Angular 中的模块混淆。这是报价:

关于imports模块中最大的困惑是开发人员认为它构成了一个层次结构。假设导入其他模块的模块成为其导入的父模块可能是合理的。然而,事实并非如此。所有模块在编译阶段合并。因此非延迟加载的模块不会创建任何层次结构。

但是,模块imports/exports可以在编译期间强制声明类型封装。如果要使用其他模块的可声明类型,则必须显式导入该模块或其他重新导出所需模块的模块。编译器在解析模板时控制封装,并且显式导入提供上下文以了解某些组件可以用作模板中的子组件。

我可以在 CTModule 的子模块中再次导入 DatePModule,但我不相信这是最好的方法。

如果您想从DatePModuleinside使用可声明类型,那是正确的方法OtherModule