我有一条声明如下的路径:
{
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我写了一个 Custom Serializer,它看起来像这样
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
只返回 search
参数,而不是 userId
和 search
。
- 如何实现从路径返回所有 params
的 CustomSerializer
? (在本例中,userId
和 search
)。
我有点尝试但失败了,while 循环的每次迭代,检查是否有参数并将它们添加到对象直到最后一个。好的,好的还是坏的方法?我怎样才能做到这一点而不失败呢?
谢谢。
最佳答案
我遇到了类似的问题,并在每次执行循环时通过扩展 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 };
}
关于angular - NgRx - 无法从 CustomSerializer 路由器商店访问的多级路由参数,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/52218583/