Angular 导航也编码 ?和 = queryParams

Question

在 Angular 中，我导航到一个页面并想给它一个 returnUrl 作为参数。我是这样做的：

this.router.navigate(['/validation'], { queryParams: { returnUrl: state.url }});

但这导致 url 为：

https://myhost/myapp/validation%3FreturnUrl%3D%252FmyUrl

我预期的位置

https://myhost/myapp/validation?returnUrl=%2FmyUrl

当我阅读文档时，URL 应该按照我的预期进行编码：值应该进行编码，但是？完好无损。

编码错误的 URL 导致我的应用无法找到 /validation URL 并将导航发送到 Angulars 404 处理。

知道哪里出了问题吗？

Answer 1

是的，Angular 可能正在编码 URL 组件，但您可以在需要时使用 decodeURIComponent：

const url = "https://myhost/myapp/validation%3FreturnUrl%3D%252FmyUrl";
const decodeURL = decodeURIComponent(url);
console.log(decodeURL)

下面的代码将为您提供 methods/properties 在 URL 上工作，即 URL.searchParams.get('returnUrl')

 const URL = new URL(decodeURL);
 console.log(URL);

它将按预期工作并从中获取参数。

Angular navigate also encodes ? and = of the queryParams