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

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

本文关键字：URL 保留 参数 字符串 查询 Angular 访问 应用 路由      更新时间：2023-09-26

我有一个运行最新alpha(37)的Angular 2测试应用。只有三条路由，像这样:

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

我可以访问路由，当我在URL中放置查询字符串参数时，我可以很好地读取它们。然而，在我读取参数后的几秒钟，我注意到路由加载良好，URL刷新，删除查询字符串参数。

也就是说，访问这个路由:

http://localhost: 5555/错误吗?abc

加载/errors路由，但在应用程序加载后，URL变成:

http://localhost: 5555/错误

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

我知道，它还在测试阶段，但这是一个bug还是我忘了在路由器上设置什么?如何在URL中保留任何查询字符串参数?

谢谢!

在Alpha 41中修复。查询字符串现在被持久化。

为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);

>

试试这个this.router。['target']， {preserveQueryParams: true});

相关文章：