Angular 7：使用查询参数刷新页面导致路径不匹配

Question

我正在使用Angular7。我正在尝试导航到定义的网址之一，并传递查询参数：

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

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

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