在Angular 8 Router 父路由导航到其他父路由时保持不变

Question

我正在做一个在 Angular (v8.2.8) 上编写的项目，并使用相同版本的路由器。路由的架构如下：

我有 app-routing.module.ts，其中有 3 个条目用于 routes 数组： Shell.childRoutes([...array of routes]), Case.childRoutes([...array of routes]), { path: '**', redirectTo: '/', pathMatch: 'full' }

Shell - 这是应用程序内部页面的父组件。案例 - 这是应用 public 页面的父组件。

方法子路由对两个组件的作用几乎相同：

export class Shell {
  static childRoutes(routes: Routes): Route {
    return {
      path: 'app',
      component: ShellComponent,
      children: routes,
      canActivate: [AuthenticationGuard],
      data: { reuse: true }
    };
  }
}

和

export class Case {
  static childRoutes(routes: Routes): Route {
    return {
      path: '',
      component: CaseComponent,
      children: routes,
      data: { reuse: true }
    };
  }
}

应用有 dashboard 组件用于 Shell 父组件和 home 组件用于 Case 父组件。用户在 home 路径加载页面，标记如下：

<app-root>
  <app-case> 
    <router-outlet></router-outlet>
    <app-home></app-home>
  </app-case>
</app-root>

在重定向到 dashboard 路由后，我希望有以下标记：

<app-root>
  <app-shell> 
    <router-outlet></router-outlet>
    <app-dashboard></app-dashboard>
  </app-shell>
</app-root>

但是我收到了

<app-root>
  <app-case> 
    <router-outlet></router-outlet>
    <app-dashboard></app-dashboard>
  </app-case>
</app-root>

所以确切的问题在测试用例中：用户所在的路线存在于 Shell 父级中。然后，如果用户将被重定向到 Case 父级中的任何路由 - 父级将保持 Shell。同样的情况也适用于其他方向。如果 Case 路由首先加载，在重定向到 Shell 路由父级后将保持这种情况。

我尝试在childRoutes方法中编辑不同的参数，但没有成功，我只是不明白是引擎的问题，还是我只需要指定一些额外的参数。

Answer 1

基本上我解决了这个问题。对于那些有同样问题的人 - 对我来说，问题在于已实施的自定义路由可重用策略。当我从 Case 切换到 Shell 时，route-reusable-strategy 函数 shouldReuseRoute 返回 true，因此路由被重用。

在Angular 8 Router 父路由导航到其他父路由时保持不变

In Angular 8 Router parent route remains the same when navigating to the route with other parent

javascript

nested-routes

angular

angular-router

angular8