如何避免在重新加载时使用参数解码 url

Question

如果电子邮件中的 Link 包含带有查询参数的绝对 URL-路径，Angular 将对此进行解码。

菜单导航以这种方式工作 <a [routerLink]="node.application.path" [queryParams]="{ reiter: node.application.argument}" (click)="onClickLink(node)">{{ node.name }}</a>

结果是 link 就像这个例子： http://localhost:4200/#/service/wissen/content/74433?reiter=74427

重新加载页面时，这将编码为： http://localhost:4200/#/service/wissen/content/74433%3Freiter%3D74427

在 Link 的电子邮件中相同

我哪里错了？

Answer 1

我相信这是您的路由器模块使用 HashLocationStrategy 的结果，这在 http://localhost:4200/.[=19 之后的 URL 中的 # 可以证明=]

URL 的 hash fragment 被当作一个字符串，因此被编码。它不被视为 Angular 正在对待它（包含路径和后续查询参数）。

为了解决这个问题，您可以简单地更改路由器模块的定位策略：

RouterModule.forRoot(
    appRoutes,
    { useHash: false } // <-- will not use HashLocationStrategy
)

如果你不能改变它（你的 config/deployment 不允许它），那么你就只能使用 Angular 从它的路由器给你的表示。否则，您可以简单地绑定到 href 属性并在您的组件逻辑中执行 URL 构造。这样，无论 URL 的路由器构建结果如何，您始终可以利用 decodeURI() or decodeURIComponent() 显示原始 URL.

如何避免在重新加载时使用参数解码 url

How to avoid decoding url with params on reload

angular

routing

url-routing