Angular 7 : refreshing page with query parameters causing path mismatch

Question

我正在使用 Angular 7。我正在尝试导航到定义的 url 之一，传递查询参数:

this.router.navigate(['/someurl'], {queryParams: {r: id}});

作为此调用的结果，应用程序导航到 localhost:4200/someurl?r=25。到目前为止这看起来不错，但在我刷新页面后，url 更改为 localhost:4200/someurl%3Fr%3D25 并导致控制台出现此错误:

Error: Cannot match any routes. URL Segment: 'someurl%3Fr%3D25'

如何强制我的应用程序(或浏览器)不替换特殊符号(在我的示例中为“?”和“=”)？我知道这是我错误的原因，但我不知道如何防止它。

Answer 1

Angular query parameters在所有路由之间共享。通过评论中的讨论，我可以建议你应该使用 matrix parameters在您的情况下，这是特定于路线的。只需将带有参数的对象直接传递给 navigate 方法即可:

this.router.navigate(['/someurl'], {r: id});