我有要求与其他用户转移页面的过滤器状态的要求。例如,当我在特定页面上并应用相同的过滤器时。我想以某些状态共享URL,即与其他用户应用过滤器。
检查https://angular.io/guide/router#route-parameters
在路由中设置
{ path: 'hero/:id', component: HeroDetailComponent }
在组件中使用
ngOnInit() {
this.hero$ = this.route.paramMap.pipe(
switchMap((params: ParamMap) =>
this.service.getHero(params.get('id')))
);
}
或没有可观察的替代方案
ngOnInit() {
let id = this.route.snapshot.paramMap.get('id');
this.hero$ = this.service.getHero(id);
}
您可以这样做
curenturl = window.location.href
paramobj = JSON.parse('{"' + currenturl.split('?')[1].replace(/&/g, '","').replace(/=/g, '":"') + '"}', function (k, v) { return k === '' ? v : decodeURIComponent(v) })
您将在url中获得属性对象
最后我找到了解决方法:
我们可以在queryParams中添加自定义键值。如果它是对象,则可以对其进行字符串化。
const tree = this.router.createUrlTree([], { queryParams: {productImpacted:this.productImpacted, Division: this.businessUnit, Region: JSON.stringify(this.regionFilter),OU:this.operatingUnit} });
console.log(this.serializer.serialize(tree)); // "/?foo=a&bar=42"
selBox.value = window.location.href+this.serializer.serialize(tree);
您可以使用以下代码从查询参数中检索数据
this.route.queryParams.subscribe(params => {
var data = params[key]
});