Параметр Angular Routing Route Params является пустым объектом в резольвере дочернего компонента - PullRequest
0 голосов
/ 19 февраля 2019

Это моя настройка маршрута.

const appRoutes: Routes = [
  {
    path: '',
    component: HomeComponent
  },
  {
    path: 'get',
    canActivateChild: [CanActivateOrder],
    children: [
      {
        path: '',
        redirectTo: 'confirm',
        pathMatch: 'full'
      },
      {
        path: 'confirm',
        component: ConfirmComponent
      },
      {
        path: 'book/:id',
        resolve: {
          pageData: BookResolver
        },
        component: BookComponent
      }]
  },
  {
    path: '**',
    redirectTo: ''
  }
];

Это мой вызов маршрутизатора для перехода на book/:id из /confirm

this._router.navigate(['get/book', 1234]);

В моем BookResolver, если я попытаюсьдоступ к любому из параметров в снимке ActivatedRoutes, я получаю пустой объект.

@Injectable()
export class BookResolver implements Resolve<any> {

  constructor(private _activatedRoute: ActivatedRoute) {}

  resolve(): Observable<Book> {
    console.log(this._activatedRoute.snapshot.params);
    //This is {}
  }

Однако, если я пытаюсь получить доступ к той же вещи из BookComponent, я получаю желаемый результат.Как, например,

export class BookComponent {
  constructor(ac: ActivatedRoute){
    console.log(ac.snapshot.params);
    //this is {id: 1234}
  }
}

Где именно моя настройка маршрута идет не так?Я предполагаю, что установка виновата здесь.Дайте мне знать, если вам нужно больше ясности в этом вопросе.

Вот стэкблиц Воспроизведение .

1 Ответ

0 голосов
/ 19 февраля 2019

Использование snapshot.params полезно только при первой загрузке компонента.Вместо этого вы должны подписаться на параметры, наблюдаемые в вашем ngOnInit.

this.ac.params.subscribe(
  (params: Params) => console.log(params);
);

, а также вместо этого хака:

this._router.navigate(['get/book', 1234])

.

this._router.navigate(['get', 'book', 1234])

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...