我编写了一个使用路由的Angular2(v2.0.1)应用程序.该网站加载了几个查询字符串参数,因此完整的URL最初如下所示:

https://my.application.com/?param1=val1&param2=val2&param3=val3

在我的路由配置中,我有一个重定向空路由的条目:

const appRoutes: Routes = [
    {
        path: '',
        redirectTo: '/comp1',
        pathMatch: 'full'
    },
    {
        path: 'comp1',
        component: FirstComponent
    },
    {
        path: 'comp2',
        component: SecondComponent
    }
];

我的问题是,应用程序启动后,URL不再包含查询参数,而是如下所示:

https://my.application.com/comp1

有没有办法配置路由,使其在导航时保留初始查询字符串?

谢谢您
卢卡斯

推荐答案

我认为没有办法在路由配置中定义这一点.

目前,它支持routerLink秒和命令式导航,以启用

您可以向空路径路径添加一个防护,在防护中,/comp1路径的导航完成.

router.navigate(['/comp1'], { preserveQueryParams: true }); //deprecated. see update note
router.navigate(['/comp1'], { queryParamsHandling: "merge" });

有一个PR允许全局配置preserveQueryParams.

Update note:https://angular.io/api/router/NavigationExtras开始,不推荐使用preserveQueryParams,改用queryParamsHandling

Angular相关问答推荐

元件不工作时的Angular 17属性 Select 器

从Angular 14更新到15个多边形.ts问题

带有搜索功能的CDK-VIRTUAL-SCROLL-VIEPORT不显示该值

成Angular 的嵌套router-outlet

Angular 16独立依赖注入问题

Primeng:安装ANGLE 16.2.0版本

如果Rxjs间隔请求仍在进行,则不应重置,但如果用户更改输入,则应重置

合并Cypress和Karma的代码覆盖率报告JSON文件不会产生正确的结果

如何在 Angular 中每 x 秒从 REST api 加载数据并更新 UI 而不会闪烁?

如何在独立组件中导入Angular innerHTML

为什么 AngularFire .set() 永远等待响应并且不继续?

如何从表单组中禁用的表单控件中获取值?

Angular 服务decorator 提供在延迟加载的根效果

在Angular 4中有条件地应用点击事件

Angular 2:无法绑定到 x,因为它不是已知的本机属性

在 webpack 构建中包含 git commit hash 和 date

如何在 Angular 2 的同一个组件中使用多个 ng-content?

ng build 时超出调用重试次数异常

为什么 ngOnInit 被调用两次?

Angular 2:从父组件获取 RouteParams