Angular组件未通过Lazyloading加载标题布局（Router Children）

Question

我正在尝试在子级路由上实现延迟加载。我可以延迟加载HomeModule，它具有多个组件（DetailComponent，SearchCardComponent等），位于内部页眉页脚布局中。

但是，当我单击SearchComponent链接时，html会正确呈现，但不会加载页眉，页脚布局。对于页眉，页脚布局，我完全指的是this example。

我具有以下路由结构：

app.routing.ts

const routes: Routes = [                                              
  {
    path: '',
    component: SiteLayoutComponent,
    children: [
        path: RouteConstants.Home,
        component: HomeComponent,
        loadChildren: "./lazyloadingmodules/home.module#HomeModule"
    ] 
  },                                                                        
  {
    path: '',
    redirectTo: '',
  }                                                                        
];

以及 HomeModule（这是惰性模块）路由：

const routes: Routes = [
//routes for post login master page
//{
    //path: '',
    //component: SiteLayoutComponent, 
    //children: [
          { 
            path: RouteConstants.SearchCard, component: SearchCardComponent 
          },
    //]
//}

];

当我单击SearchCardComponent routerLink时，它会正确加载SearchCardComponent，但组件不会显示在插座区域中。它以页眉页脚布局显示。

可以让我看看代码中的错误是什么吗？

谢谢

Answer 1

深入研究代码后，我找到了解决方案。惰性模块路由存在错误。

懒惰模块路由代码更改自：

{ 
     path: RouteConstants.SearchCard, component: SearchCardComponent 
},

收件人

{ 
     path: '', component: SearchCardComponent 
},

现在可以正常工作了。