尝试对 parent 但不对 child 应用保护

Question

我正在尝试应用 Guard 来访问我的列表路径，但是激活路由的登录名是它的 child，是否可以使用 Guard 来防止访问 parent 而不是 children ?

const routes: Routes = [
  {path: "", component: TirageComponent},
  {path: "tirage", redirectTo: ""},
  {path: "historique", component: HistoriqueComponent},
  {path: "liste", component: ListeComponent, canActivate: [AuthGuard] ,children: [
    {path: "login", component: AuthComponent}
  ]},
  {path: "**", redirectTo: "tirage"}, 
];

这是我的路由代码，每当我尝试访问/liste/login时，它都不让我访问它，所以我无法访问登录和登录后应该可以访问的页面

Answer 1

最简单的解决方案是将子项移出其父项：

const routes: Routes = [
  {path: "", component: TirageComponent},
  {path: "tirage", redirectTo: ""},
  {path: "historique", component: HistoriqueComponent},
  {path: "liste", component: ListeComponent, canActivate: [AuthGuard]},
  {path: "liste/login", component: AuthComponent}
  {path: "**", redirectTo: "tirage"}, 
];

Answer 2

如果我没记错的话，访问子路由的唯一方法是通过父路由。如果您要禁用父路由，您将无法访问子路由。

据我所知，您有两个选择：

切换liste和login路由，在新的子路由上使用守卫。这样您就可以随时访问登录屏幕，保护您的列表。这会有点弄乱你的路线。你会得到类似域的东西。com/login/liste 但显然你可以稍微更改命名。

您也可以完全拆分路线，这将为您提供两条单独的路线。您可以随时访问的登录名和可以使用路由守卫保护的列表名。 这是我建议的选项。

  const routes: Routes = [
    {path: "", component: TirageComponent},
    {path: "tirage", redirectTo: ""},
    {path: "historique", component: HistoriqueComponent},
    {path: "liste", component: ListeComponent, canActivate:[AuthGuard]},
    {path: "login", component: AuthComponent}
    {path: "**", redirectTo: "tirage"}, 
  ];

希望此见解对您有所帮助！

尝试对 parent 但不对 child 应用保护

tryin to apply a guard to parent but not on child

angular

angular2-routing