ActivatedRoute & AuthGuard — проблема с получением идентификатора из paramMap

В настоящее время я разрабатываю веб-сайт для экзаменационного проекта, однако сталкиваюсь с проблемой, что мой код не возвращает правильный идентификатор, когда я использую свой AuthGuard.

событие-details.component.ts

  getEvent(): void {
    const id = +this.route.snapshot.paramMap.get('id');
    this.eventService.getEvent(id)
      .subscribe(event => this.event = event);
      console.log(id);
  }

приложение-routing.module.ts

  {path: 'events', component: EventsComponent},
  {path: 'events/4', component: EventDetailsComponent, canActivate: [AuthGuard]},
  {path: 'events/:id', component: EventDetailsComponent},

admin.guard.ts

 canActivate(): boolean {
      console.log('In guard, canActivate() called');
      var token = localStorage.getItem('token');
      var key = localStorage.getItem('key');
      var decodedtoken = this.jwtHelper.decodeToken(token);
      console.log(decodedtoken);
      var tokenExpired:boolean = this.jwtHelper.isTokenExpired(JSON.stringify(token));
      console.log("tokenExpired was:" + tokenExpired);
      if (key=='ACCEPTED'&&!tokenExpired)
        return true; 
      else{
        this.router.navigate(['/events']);
        return false;
      }

  }

Я ожидаю, что в консоли будет зарегистрирован идентификатор 4, когда я вхожу в систему с токеном с неистекшим сроком действия, а также в этом случае отображается правильное событие. В настоящее время он показывает «0» в качестве вывода.

У вас есть идентификатор в токене? Вам нужно отправить ID с токеном, а затем передать его в this.router.navigate(['/events']);

Maihan Nijat 22.05.2019 14:26

@MaihanNijat Это ложный маршрут, означающий, что он просто перенаправляет на «главную страницу». Это истинный маршрут, который является проблемой. Идентификатор извлекается из моего paramMap, и он работает до тех пор, пока у меня нет охраны.

Meik F 22.05.2019 14:27

Вы можете воссоздать эту проблему в stackblitz?

gunjit 22.05.2019 15:00
В чем разница между Promise и Observable?
В чем разница между Promise и Observable?
Разберитесь в этом вопросе, и вы значительно повысите уровень своей компетенции.
Обработка ошибок при выполнении HTTP-запросов в JavaScript.
Обработка ошибок при выполнении HTTP-запросов в JavaScript.
Каждый проект должен выполнять HTTP-запросы, и, конечно, некоторые из этих запросов могут содержать ошибки. Нам нужно знать, как обрабатывать эти...
Включение UTF-8 в jsPDF с помощью Angular
Включение UTF-8 в jsPDF с помощью Angular
Привет, разработчики, я предполагаю, что вы уже знаете, как экспортировать pdf через jsPDF. Если ответ отрицательный, то вы можете ознакомиться с моей...
1
3
557
1
Перейти к ответу Данный вопрос помечен как решенный

Ответы 1

Ответ принят как подходящий

У вас есть два одинаковых маршрута в вашей конфигурации маршрутизации:

..
  {path: 'events/4', component: EventDetailsComponent, canActivate: [AuthGuard]},
  {path: 'events/:id', component: EventDetailsComponent},
..

Первый маршрут с 4 не имеет id параметра. Поэтому, когда вы откроете этот маршрут (<base_href>/events/4), вы получите значение по умолчанию для номера - 0

Так что просто замените 4 на :id и удалите второй маршрут.

ОБНОВИТЬ

Чтобы реализовать защиту только для id === 4, немного измените метод canActivate:

canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot): Observable<boolean> | Promise<boolean> | boolean {

   const id = +route.paramMap.get('id');

   if(id !== 4)
    return true;

    ......
}

Итак, если бы я хотел только этот один путь; 4, иметь охрану; как мне нужно реорганизовать мой метод получения идентификатора?

Meik F 22.05.2019 15:16

Другие вопросы по теме