Question

对必须简单的概念感到尴尬：

app.module
    declares  NavComponent  <-- to be used see below
              SplashPage    <-- successfully references NavComponent
    exports   NavComponent
    imports   PreRegistrationModule

PreRegistrationModule   <- a "child" of app module
    imports   OverviewModule

  OverViewModule        <- a "child of PreRegistration module
      declares  HowToUseThisProgramComponent

    HowToUseThisProgramComponent   <- a "child of OverView module
        HowToUse.html  contains  <app-nav></app-nav>  <- defined in NavComponent

我的（误会）理解是，我应该能够在HowToUseThisProgram.html中使用NavComponent，因为它是app.module的后代，其中NavComponent被声明（并导出了）。

我收到错误消息'app-nav'不是一个已知元素...但是，app-nav在SplashPage组件中的工作正常，该组件与PreRegistration Module处于同一级别。

我无法将NavComponent“导入”到任何子模块，因为（我认为）使NavComponent成为多个模块（非法）的子模块。

我想念什么？
在此先感谢Chuck（“瑜伽士”）

Answer 1

这里的问题是NavComponent属于AppModule，而它不属于OverViewModule。另一方面，您可以在SplashPage中直接使用它，因为它们都在同一个模块中。

如果要使用NavComponent，则应创建一个新模块，可以在其中声明它，将其导出，然后导入AppModule和OverViewModule。

例如：

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

然后在AppModule中：

@NgModule({
  declarations: [
    NavComponent
  ],
  imports: [
    CommonModule,
    SharedComponentsModule
  ],
})
export class AppModule { }

最后在OverViewModule中：

@NgModule({
  declarations: [
    HowToUseThisProgramComponent
  ],
  imports: [
    CommonModule,
    SharedComponentsModule
  ],
})
export class OverViewModule { }

在app.module.ts中声明的有角子HTML引用组件

1 个答案: