如何使用"complete Url"(带有参数的网址)在 Angular 中进行导航



我有一个搜索页面,有很多过滤器选项,这些选项都作为搜索页面上的参数传递给 url(因此可以共享搜索(。 当转到搜索结果中一行的详细信息页面时,我将搜索结果的完整 Url 解析为详细信息页面作为参数(detail/1?returnUrl=%2Fsearch%2Fresults%3Fsw%3D%26n%3D%26ee%3D2%26a....(, 以便可以返回(在详细信息页面上,有一些选项卡可以使用 routerlink 导航到,因此我无法使用任何历史记录返回来导航回搜索结果(。

问题是,我的详细信息页面上有一个完整的URL(例如/search/result?a=1&b=people&c=8&d=all&p1=1(,如何导航到该URL?

如果我把它放在routerlink="/search/result?a=1&b=people&c=8&d=all&p1=1"中,它不起作用。

提前非常感谢:)

更新

我已经尝试了以下方法,但它不起作用:

public goBack() {
const returnUrl = this.activatedRoute.snapshot.queryParamMap.get('returnUrl');
const array1 = returnUrl.split('?');
const array = array1[1].split('&');
let parameters = '';
array.forEach(param => {
const param1 = param.split('=');
parameters += `${param1[0]}:'${param1[1]}',`;
});
this.router.navigate([array1[0]], { queryParams: {parameters} });
}

它在 URL 中写入以下链接:

http://localhost:4200/search/results?parameters=sw:%27%27,n:%27%27,ee:%272%27,a:%27true%27,l:%27%27,c:%27%27,ad:%27%27,cr:%27%27,pn:%271%27,s:%271%27,sd:%271%27,

编辑:回答您的更新问题

Angulars 路由器中navigate的方法接受Params作为属性查询参数的参数 - 而不是字符串。

public goBack() {
const returnUrl = this.activatedRoute.snapshot.queryParamMap.get('returnUrl');
const array1 = returnUrl.split('?');
const array = array1[1].split('&');
let parameters = {};
array.forEach(param => {
const param1 = param.split('=');
parameters[param1[0]] = param1[1];
});
this.router.navigate([array1[0]], { queryParams: parameters });
}

以下:对之前提出的问题的回答

查询参数应在其自己的属性中传递。

查看 https://angular.io/api/router/RouterLink#description 中的示例

<a [routerLink]="['/search/result']" [queryParams]="{ 'a': 1, 'b': 'people', 'c': 8, 'd': 'all', 'p1': 1}">
Products
</a>

最新更新