NgRx - 无法从 CustomSerializer Router Store 访问多级路由参数

Question

我有一个声明如下的路径：

{
  path: 'app/:userId',
  children: [...AppChildrenRoutes]
}

然后，在 AppChildrenRoutes 中

{ path: 'feature', component: MainFeatureComponent }

因此，在我的应用程序的某个时刻，我可以拥有localhost:4200/app/123/feature. 在这个组件中，通过一些操作，我可以导航到另一个这样的路线：

this.router.navigate([
  'app',
  this.userId,
  'feature',
  { search: this.searchFor }
]);

将其视为正在改变架构的大型企业级应用程序，逐步使用 NgRx。
所以，我遇到了路由器商店的问题。我已经设置了一切并且它有效。
按照 Router Store docs我写了一个自定义序列化程序，它看起来像这样

serialize(routerState: RouterStateSnapshot): RouterStateUrl {
  const { url } = routerState;
  const queryParams = routerState.root.queryParams;

  while (route.firstChild) {
    route = route.firstChild;
  }
  const params = route.params;

  return { url, queryParams, params };
}

我发现，考虑到像这样的 URI

localhost:4200/app/123/feature;search=blue

该route.params只返回searchPARAM，不能同时userId和search。

- 我怎样才能实现从路径CustomSerializer返回的所有内容params？（在这种情况下，userId和search）。

我有点尝试但失败了，while 循环的每次迭代，检查是否有参数并将它们添加到对象中，直到最后一个。好，好还是坏的方法？我怎样才能做到这一点而不失败？
谢谢。

Answer 1

我有一个类似的问题，并通过每次遍历循环时扩展 params 对象来解决它。

我的 CustomSerializer 现在看起来像这样：

export class CustomSerializer implements RouterStateSerializer<RouterStateUrl> {
serialize(routerState: RouterStateSnapshot): RouterStateUrl {
    let route = routerState.root;

    let params = {};
    while (route.firstChild) {
        params = {
            ...params,
            ...route.params
        };
        route = route.firstChild;
    }

    const {
        url,
        root: { queryParams }
    } = routerState;

    return { url, params, queryParams };
}

}