多个路由器插座，命名为路由器插座不起作用

Question

我试图在同一路径上得到多个路由器出口工作通过不同的分量，但是，下面的代码无法正常工作。

路线：

const routes: Routes = [
{ path: 'products', component: ProductComponent},
{ path: 'products', component: ProductHeaderComponent, outlet: 'header-route' },
{ path: 'products', component: ProductFooterComponent, outlet: 'footer-route' }
];

HTML：

<router-outlet></router-outlet>//Primary Outlet
<router-outlet name="header-route"></router-outlet>
<router-outlet name="footer-route"></router-outlet>

主要出口有效。

命名插座，页眉路由和页脚路由不起作用。

Answer 1

您可以使用多个路由器出口，并通过使用（出口名称：路由）访问辅助路由器的URL，例如：

localhost:4200/loginpage(header-route: products)

实时示例：Stackblitz