Как перенаправить на какой-либо компонент в Angular, когда URL-адрес имеет несколько переменных, объединенных с помощью «&»?

Из бэкэнда я получаю следующий URL

http://localhost:4200/paypal/?paymentId=PAYID-L7LA6CT5K826252R&token=EC-1R8557872G&PayerID=8ANSA9QW

Моя цель - перенаправить на домашний компонент при появлении этой ссылки.

На данный момент я пытаюсь сделать это с помощью модуля угловой маршрутизации следующим образом:

const routes: Routes = [
  { path: 'home', component: HomeComponent},
  { path: 'PayPal/:paymentId&:token&:PayerID', component: HomeComponent}
];

Как мне структурировать маршрут для перенаправления на компонент?

Тестирование функциональных ngrx-эффектов в Angular 16 с помощью Jest
В системе управления состояниями ngrx, совместимой с Angular 16, появились функциональные эффекты. Это здорово и делает код определенно легче для...
Angular и React для вашего проекта веб-разработки?
Angular и React для вашего проекта веб-разработки?
Когда дело доходит до веб-разработки, выбор правильного front-end фреймворка имеет решающее значение. Angular и React - два самых популярных...
Эпизод 23/17: Twitter Space о будущем Angular, Tiny Conf
Эпизод 23/17: Twitter Space о будущем Angular, Tiny Conf
Мы провели Twitter Space, обсудив несколько проблем, связанных с последними дополнениями в Angular. Также прошла Angular Tiny Conf с 25 докладами.
Угловой продивер
Угловой продивер
Оригинал этой статьи на турецком языке. ChatGPT используется только для перевода на английский язык.
Мое недавнее углубление в Angular
Мое недавнее углубление в Angular
Недавно я провел некоторое время, изучая фреймворк Angular, и я хотел поделиться своим опытом со всеми вами. Как человек, который любит глубоко...
Освоение Observables и Subjects в Rxjs:
Освоение Observables и Subjects в Rxjs:
Давайте начнем с основ и постепенно перейдем к более продвинутым концепциям в RxJS в Angular
0
0
5 347
1
Перейти к ответу Данный вопрос помечен как решенный

Ответы 1

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

нет необходимости добавлять эти параметры запроса в путь маршрута. вам просто нужно иметь paypal. И в навигации просто перемещайтесь по параметрам запроса, как это

Маршруты

const routes: Routes = [
  { path: 'home', component: HomeComponent},
  { path: 'paypal', component: HomeComponent}
];

Навигация

import { ActivatedRoute, Router } from '@angular/router';

export class AppComponent  {
  constructor(
     private router: Router,
     private activeRoute: ActivatedRoute
  ) { 
     this.router.navigate(['paypal'], { queryParams: {
       paymentId: 'PAYID-L7LA6CT5K826252R',
       token: 'EC-1R8557872G',
       PayerID: '8ANSA9QW'
     }});
  }

}

Кроме того, вы можете получить эти параметры запроса из активированного маршрута, как это

import { ActivatedRoute, Router } from '@angular/router';

export class AppComponent  {

  constructor(
     private router: Router,
     private activeRoute: ActivatedRoute
  ) { 
   // get the params only one time
   console.info(activeRoute.snapshot.queryParams, 'paypal query params');

   // or you can subscribe the query param changes
   
   activeRoute.queryParams.subscribe(params => {
         console.info(params, 'paypal query params from the subscription');
   })
  }

  
}

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