角度路由路由参数是子组件解析器中的空对象

Question

这是我的路线设置。

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: ''
}
];

这是我从/confirm导航到book/:id的路由器调用

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

在我的 BookResolver 中，如果我尝试访问 Activated Routes 快照下的任何参数，我会得到空对象。

@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}
}
}

我的路线设置到底哪里出了问题？我假设这里的设置有问题。如果您需要更清楚地了解这个问题，请告诉我。

这是一个堆叠闪电战的复制品。

Answer 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])