Question

我正在尝试在Angular 6中实现路由，但是NgModules的多个级别存在问题。

模块的结构如下（B和C是A的子代）：

A_Module
  B_Module
  C_Module

这是我的顶级NgModule中的一段代码：

// A_Module
const routes = [
  { path: 'B', component: B_Component },
  { path: 'C', component: C_Component },
]

@NgModule({
  declarations: [
    A_Component
  ],
  imports: [
    B_Module,
    C_Module,
    RouterModule.forRoot(routes),
  ],
  providers: [],
  bootstrap: [A_Component]
})
export class A_Module { }

B_Component和C_Component是其自身模块中的顶级组件。

此解决方案不起作用，因为在此A_Module中没有声明B_Module或C_Module的组件。事实是，在B_Module和C_Module内部有许多组件，将所有内容移至A_Module并不是解决方案（这就是为什么正确使用模块的原因-清理和分离代码？）。

有什么解决办法吗？

Answer 1

在其模块中导出B_Component和C_Component。

@NgModule({
  declarations: [BComponent],
  exports: [BComponent]
})
export class BModule {}

@NgModule({
  declarations: [CComponent],
  exports: [CComponent]
})
export class CModule {}

具有多个NgModule级别的Angular 6路由

1 个答案: