Угловая маршрутизация с параметрами запроса - PullRequest
Новая
       55

Угловая маршрутизация с параметрами запроса

0 голосов
/ 10 мая 2019

В настоящее время я использую Angular: 7.2.14 и хотел бы узнать, может ли кто-нибудь объяснить, как перенаправить параметры запроса с помощью средства защиты маршрута, общего сервиса или других средств и т. Д.

Проблема I 'Чтобы попытаться решить, требуется, чтобы параметры запроса поступали из корневого пути Uri, а затем перенаправляли маршрут на правильный дочерний компонент, сохраняя запрос без изменений, когда маршрутизатор изменяет Uris.

Например, допустим, что у вас есть внешняя ссылка, связанная с угловым приложением (см. Маршруты ниже), а исходная ссылка маршрута: domain.com?foo=bar, так как это корневой маршрут '', тогда угловой будет передаватьмаршрут к соответствующему дочернему маршруту '', который, в свою очередь, перенаправляет на 'login'.Конечный результат приводит вас сюда domain.com/#/login, и мой запрос ?foo=bar теряется.

Как вы создаете маршрут, охрану маршрута или даже службу и т. Д. И поддерживаете исходный запрос, но также перенаправляете васдо конечного местоположения domain.com/#/login?foo=bar, начиная с корневого пути? 

const routes: Routes = [
  {
  path: '', component: AuthorizeComponent,
  children: [
    { path: '', redirectTo: 'login'  },
    { path: 'login', component: LoginComponent, canActivate: [LoginGuardService] },
    { path: 'confirm', component: ConfirmComponent, canActivate: [ConfirmGuardService] },
    { path: 'error', component: ErrorComponent },
  ]
}];

Я попытаюсь показать мои настройки здесь.У меня действительно есть LoginGuardService, который реализует canActivate, и внутри функции canActivate я могу перенаправить, сохраняя запрос вместе, используя router.navigate(['/login'], { queryParams: route.queryParams }), за исключением того, что ТОЛЬКО это работает, когда вы напрямую связываетесь с маршрутом, таким как domain.com/#/login?foo=bar, а не с корнем сначала,

LoginGuardService 

canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot) {

    if (this.auth.isLoggedIn()) {
      this.router.navigate(['/confirm'], { queryParams: route.queryParams });
   } else {
      return true;
   }

}

ConfirmGuardService 

 canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot) {

   if (!this.auth.isLoggedIn()) {
     this.router.navigate(['/login'], { queryParams: route.queryParams });
   } else {
     return true;
   }

 }

1 Ответ

0 голосов
/ 11 мая 2019

Установите queryParamsHandling: 'preserve' в дополнительных элементах навигации ( Ресурс ): 

this.router.navigate(['/confirm'], { queryParamsHandling: 'preserve' });
...