angular - Angular Routing Route Params 是子组件解析器中的空对象

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

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

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

这是一个 stackblitz复制。

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