angular - 基于 api 调用的 Route Guard

Question

我有一个角度的路由守卫，它根据 api 调用返回 true 或 false

我在多条路线上使用这个路线保护，我的问题是：api 是否会为我放置路线保护的每条路线调用？如下图所示，我大量使用它：

Answer 1

是的，它确实。您还可以将路由包装在父组件中，如果在子路由之间导航，这只会激活一次。

export const routes: Routes = [
  {
    path: 'error',
    component: ErrorComponent,
  },
  {
    path: 'login',
    component: LoginComponent,
  },
  { path: '', component: MainParentComponent, canActivate: [MainRouteGuard],
    children: [
      { path: '', redirectTo: 'child1', pathMatch: 'full' },
      { path: 'child1', component: ChildComponent },
      { path: 'child2', component: ChildComponent }
    ]
  }
];

另外，请记住：Angular 将按照定义的顺序解析路由模式。因此，如果您使用 root'' '/'作为主要组件路由，请确保在路由中定义 main 之上的其他路由。否则它将始终匹配，并尝试运行守卫。

此外，CanActivate 可以采用 bool/promise/observable/UrlTree。所以不需要像你一样改变它们。