Параметр Angular Routing Route Params является пустым объектом в резольвере дочернего компонента
Это моя настройка маршрута.
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 ответ
С помощью snapshot.params
хорошо только тогда, когда компонент загружается впервые. вместо этого вы должны подписаться на наблюдаемый параметр на вашем ngOnInit
,
this.ac.params.subscribe(
(params: Params) => console.log(params);
);
также вместо этого хака
this._router.navigate(['get/book', 1234])
Вы должны правильно ориентироваться:
this._router.navigate(['get', 'book', 1234])