我正在开发一个具有以下URL路径的角度应用程序,
/ (根)
/培训班
/课程/创建
/ courses /:id
/ auth /登录
我为auth/login
以外的所有路由添加了AuthGuard。如果未经身份验证,AuthGuard
重定向到auth\login
。
app-routing.module.ts
export const Approutes: Routes = [
{
path: '',
canActivate: [AuthGuard],
component: FullComponent,
loadChildren: () => import('./pages/pages.module').then(m => m.PagesModule) // loading from pages-routing.ts
},
{
path: 'auth',
component: PlainComponent,
children: [
{
path: '',
pathMatch: 'full',
redirectTo: 'login'
},
{
path: 'login',
component: LoginComponent
}
]
},
{
path: '**',
redirectTo: ''
}
];
pages-routing.ts
export const PagesRoutes: Routes = [
{
path: '',
children: [
{
path: '',
pathMatch: 'full',
redirectTo: 'courses'
},
{
path: 'courses',
component: CourseMainPageComponent,
data: {
title: 'My Courses'
}
},
{
path: 'courses/create',
component: CourseCreatePageComponent,
data: {
title: 'Create Course'
}
},
{
path: 'courses/:id',
component: CourseShowPageComponent,
data: {
title: 'Course Detail'
}
},
]
}
];
问题
所有路由和authGuard都可以正常工作。但是,当我输入根URL
\
时,我需要重定向到\courses
,但是它不起作用。同样在根URL \
中,AuthGuard甚至不会将我重定向到auth\login
。注意
我没有任何运行时或编译错误。
最佳答案
您需要在用于重定向的路由中将pathMatch策略更改为full
。根据文档,
路径匹配策略“完整”与整个URL匹配。重定向空路径路由时,执行此操作很重要。否则,因为空路径是任何URL的前缀,所以路由器即使在导航到重定向目标时也将应用重定向,从而造成无限循环。
您的路由配置现在看起来像这样
export const PagesRoutes: Routes = [{
path: '',
children: [{
path: '',
redirectTo: 'courses',
pathMatch: 'full'
},
// Add other routes here
]
}];