Не удалось получить параметр, отправленный в маршрутизатор в Ionic 4

В моем проекте Ionic 4 я отправляю параметр с помощью маршрутизатора, но не могу получить параметр на другой странице.

Это мой вкладки.маршрутизатор.модуль.тс:

{
    path: 'tab2',
    children: [
      {
        path: '',
        loadChildren: '../tab2/tab2.module#Tab2PageModule'
      },
      {
        path: 'eventdetails',
        loadChildren: '../eventdetails/eventdetails.module#EventdetailsPageModule'
      },
      {
        path: 'acceptchallenge/:chid',
        loadChildren: '../acceptchallenge/acceptchallenge.module#AcceptchallengePageModule'
      }
    ]
},

Это мой tab2.page.ts:

acceptchallenge(challengesobj)
{
 console.info('Accept Challenge:', challengesobj);
 this.router.navigate(['/tabs/tab2/acceptchallenge/' + challengesobj.id,challengesobj]);
}

В этом ТС я отправляю challengesobj на другую страницу, но не могу его получить.

Это мой accept.page.ts:

export class AcceptchallengePage implements OnInit {
  chaobj: any;
  constructor(private route: ActivatedRoute) { }

  ngOnInit() {
  }
  async ionViewWillEnter(){
    let me=this;  
    this.route.params.subscribe(params => {
      me.chaobj = params['challengesobj']; 
    });
    console.info('challengesobj: ', me.chaobj);
  }
}

В этом файле ts, когда я настраиваю значение, оно показывает неопределенное.

Любая помощь горячо приветствуется.

что показывает params?

Sachin Gupta 09.04.2019 07:39

@SachinGupta. Этот параметр challengeobj — это объект, который я отправляю, и он показывает undefined.

Raghav Pamnani 09.04.2019 07:41
Тестирование функциональных 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
1
2
2 037
1
Перейти к ответу Данный вопрос помечен как решенный

Ответы 1

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

Попытайся:

Отправка объекта:

acceptchallenge(challengesobj)
{

let navigationExtras: NavigationExtras = {
  queryParams: {
    special: JSON.stringify(challengesobj)
  }
};

 this.router.navigate(['/tabs/tab2/acceptchallenge/' + challengesobj.id,navigationExtras]);
}

Получение объекта:

 export class AcceptchallengePage implements OnInit {
      chaobj: any;
      constructor(private route: ActivatedRoute) { 

        this.route.queryParams.subscribe(params => {
           if (params && params.special) {
               this.chaobj = JSON.parse(params.special);
               console.info('challengesobj: ', this.chaobj);
           }
        });
}

  ngOnInit() {
  }

}

Другой путь:

Отправка объекта:

acceptchallenge(challengesobj)
{

let navigationExtras: NavigationExtras = {
  state: {
    challengesobj: challengesobj
  }
};

 this.router.navigate(['/tabs/tab2/acceptchallenge/' + challengesobj.id,navigationExtras]);
}

Получение объекта:

Получение объекта:

 export class AcceptchallengePage implements OnInit {
      chaobj: any;
      constructor(private route: ActivatedRoute) { 

         this.route.queryParams.subscribe(params => {
            if (this.router.getCurrentNavigation().extras.state) {
              this.chaobj = this.router.getCurrentNavigation().extras.state.challengesobj;
          }
       });
}

  ngOnInit() {
  }

}

Отображение неопределенного. Должен ли я также определять маршруты.

Raghav Pamnani 09.04.2019 08:03

путь: 'acceptchallenge/:chid', я определил идентификатор, поэтому я получаю идентификатор, но не 'challengeobj'

Raghav Pamnani 09.04.2019 08:04

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