Angular：延迟加载子模块并将其主要组件注入到父主组件的视图中

Question

我有一个父模块，我在其中延迟加载一个子模块

如您所见，我没有直接导入我的子模块，而是在路由文件下懒惰地加载它：

父模块：

@NgModule({
  imports: [
    CommonModule,
    ParentRoutingModule,
  ],
  exports: [
    ParentRoutingModule
  ],

  declarations: [ParentComponent]
})
export class ParentModule { }

父路由模块：

const parentRoutes: Routes = [
  {path: '', component: ParentHomeComponent}, 
  {
    path: '',
    loadChildren: () => ChildModule,
    canLoad: [ChildModuleGuard]
  },
];

@NgModule({
  imports: [
    CommonModule,
    RouterModule.forChild(parentRoutes)
  ],
  declarations: [],
  exports: [
    RouterModule
  ]
})
export class ParentRoutingModule { }

在我的主要 ParentModule 组件中； ParentHomeComponent 我想注入我的 ChildHomeCOmponent 的视图，如下所示：

<p>
  Parent-home works!
</p>
<app-Child-home></app-Child-home>

但这会引发一个错误，指出 ChildHomeComponent 不是 ParentModule 的一部分（因为我没有直接导入它）；

如何处理？？

我希望 如果模块已加载，我的 child home 组件t 会显示在 parent home 组件

下

建议？？

Answer 1

这不是 Angular 中延迟加载的工作方式。

非延迟加载模块无法访问延迟加载模块中的组件。