子路由路径可以在 Angular 9 路由中的辅助/辅助路由中工作吗？

Question

我在与 Angular 9.

的辅助/辅助/命名路由器出口结合使用时遇到问题

我确实在 stackblitz 中设置了一个示例： https://stackblitz.com/edit/angular9-routing-aux?file=src/app/app-routing.module.ts

简而言之，以下正常/主要路由工作：

// For Primary outlet child routes work fine
{
  path: 'phome1',
  children: [
    {
      path: '',
      pathMatch: 'full', 
      component: PrimaryHome1Component
    },
    {
      path: 'pitem1',
      component: PItem1Component
    }
  ]
},

但是，如果我尝试对辅助/次要路由使用相同的设置，则它不起作用：

// For Auxiliary / Secondary outlet child routes don't seem to work
{
  path: 'cases',
  outlet: 'aux',
  children: [{
    path: '',
    pathMatch: 'full',
    component: CasesComponent,
    outlet: 'aux'
  },{
    path: ':id',
    component: EditCaseComponent,
    outlet: 'aux'
  }]
},

我得到的错误是路线不匹配或什么都没发生。

我是不是做错了什么？

在此先感谢您的帮助！

Answer 1

问题出在 app-routing 文件中的命名。一旦你在顶层声明了一个使用命名插座的路由，你就不需要再继续指定它了：

{
  path: 'cases',
  outlet: 'aux',
  children: [{
    path: '',
    pathMatch: 'full',
    component: CasesComponent,
    // outlet: 'aux'   // remove this<<<<
  },{
    path: ':id',
    component: EditCaseComponent,
  }]
},

子路由路径可以在 Angular 9 路由中的辅助/辅助路由中工作吗？

Can child route path(s) work in an Auxiliary / Secondary route in Angular 9 routing?

angular

angular-router

angular9