具有多级 NgModules 的 Angular 6 路由

Posted 2023-02-23

【中文标题】具有多级 NgModules 的 Angular 6 路由

【英文标题】：Angular 6 routing with multiple levels of NgModules

【发布时间】：2019-01-08 18:26:01

【问题描述】：

我正在尝试在 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 并不是解决方案（这就是为什么要正确制作模块 - 清理和分离代码？）。

有什么解决办法吗？

【参考方案1】：

在其模块中导出 B_Component 和 C_Component。

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

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

【讨论】：

谢谢，它有效！我还需要从 AModule 声明中删除 BComponent 和 CComponent，但除此之外 - 有效。

很高兴我能帮上忙 :) 如果可能，请将此标记为答案。

会的，但是因为你太快了，我必须再等 7 分钟：D