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

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

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

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