У меня есть раздел заказа в моем приложении:
RouterModule.forChild([
{
path: '',
component: OrderComponent,
canActivate: [OrderGuard],
children: [
{
path: '',
component: OrderInfoComponent
},
{
path: 'approved',
component: OrderApprovedComponent
},
{
path: 'declined',
component: OrderDeclinedComponent
}
]
}
])
Я должен перенаправить пользователя на соответствующую страницу в зависимости от состояния заказа. Я создал охранника:
canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot): UrlTree {
const order = ...; // Imagine we fetch the order here...
let path: string;
switch (order.state) {
case OrderState.Default:
path = '';
break;
case OrderState.Approved:
path = 'approved';
break;
case OrderState.Declined:
path = 'declined';
break;
}
return this.router.parseUrl(`${state.url}/${path}`);
}
Вот что происходит (для order.state === 'approved'
):
- Пользователь переходит на
/order
. - Охрана перенаправляет пользователь на
/order/approved
. - Пользователь на
/order/approved
. - Guard перенаправляет пользователя на
/order/approved/approved
. - Выдается ошибка
Cannot match any routes
.
Другими словами, оно переходит в бесконечное l oop. Как я могу сломать это? Я смотрел на это решение , но он оставляет параметр запроса skip
после перенаправления и не работает с UrlTree, поскольку мы не можем передавать параметры запроса. Я также хочу правильно перенаправить пользователя, если он пошел по дочернему маршруту (/declined
или /approved
).