Angular 2 parent 的路径替换为 child 的路径

Question

这是我当前最新版本的路由配置 Angular app

const routes = [
  { path: 'board', component: BoardComponent, canActivate: [AuthGuard], children: [
    { path: 'stories', component: StoryComponent }]},
    { path: '**',   redirectTo: 'board', pathMatch: 'full' }
];

它工作正常，两个组件都显示了，我想以相同的方式工作，但有一点变化：当用户路由到 /board/stories 时，我希望路径只是 /stories , 这样可以吗？

Answer 1

根据您定义路线的方式 - 不，这是不可能的。

通过将 stories 定义为 board 的子节点，您确实将路由定义为 .../board/stories。因此，只有 /stories 的路由不会匹配您定义的任何路由。

如果您希望路线只是 /stories 那么您只需将路线重新定义为

const routes = [
  { path: 'board', component: BoardComponent, canActivate: [AuthGuard]},
  { path: 'stories', component: StoryComponent, canActivate: [AuthGuard]},
  { path: '**',   redirectTo: 'board', pathMatch: 'full' }
];

Angular 2 parent 的路径替换为 child 的路径

Angular 2 parent's path replaced with child's path

nested-routes

angular