如何在访问 Angular 2 应用程序的路由时将查询字符串参数保留在 URL 中？

Question

我有一个 Angular 2 测试应用运行最新的 alpha (37)。只有三个路线，看起来像这样：

@RouteConfig([
  { path: '/', component: Home, as: 'home' },
  { path: '/errors', component: Errors, as: 'errors' },
  { path: '/about', component: About, as: 'about' }
])

我可以访问路由，当我在 URL 中放置查询字符串参数时，我可以很好地读取它们。然而，在我读取参数后不久，我注意到路由加载正常并且 URL 刷新，删除了查询字符串参数。

也就是说访问这条路由：

http://localhost:5555/errors?test=abc

加载 /errors 路由，但在应用程序加载后 URL 立即变为：

http://localhost:5555/errors

这会让用户感到困惑。我想将查询字符串参数保留在 URL.

我知道，它处于 alpha 阶段，但这是一个错误还是我忘记在路由器上设置一些东西？如何在 URL?

中保留任何查询字符串参数

谢谢！

Answer 1

这已在 Alpha 41 中修复。查询字符串现在已保留。

Answer 2

更新 Angular 2：
要保留当前 url 中存在的查询参数，请添加

// import NavigationExtras 
import  { NavigationExtras } from '@angular/router';

// Set our navigation extras object
// that contains our global query params

let navigationExtras: NavigationExtras = {
      preserveQueryParams: true
    };   

// Navigate to the login page with extras
this.router.navigate(['/someLink'], navigationExtras);

有关详细信息，请查看 here：

Answer 3

试试这个 this.router.navigate(['target'], {preserveQueryParams: true});

如何在访问 Angular 2 应用程序的路由时将查询字符串参数保留在 URL 中？

How to keep query string parameters in URL when accessing a route of an Angular 2 app?

javascript

web

angularjs-routing

angular