Angular:将查询参数附加到URL

问题描述 投票:8回答:3

我用这个:

import { HttpParams } from '@angular/common/http';
let params = new HttpParams();
  params.append('newOrdNum','123');

但这不起作用,我不会在网址中附加param。有什么建议吗?

angular angular2-routing query-parameters angular2-router
3个回答
28
投票

这可以通过使用Router类来存档:

使用组件:

import { Router, ActivatedRoute } from '@angular/router';

@Component({})
export class FooComponent {
   constructor(
     private _route: ActivatedRoute,
     private _router: Router
   ){}

   navigateToFoo(){
     // changes the route without moving from the current view or
     // triggering a navigation event,
     this._router.navigate([], {
      relativeTo: this._route,
      queryParams: {
        newOrdNum: '123'
      },
      queryParamsHandling: 'merge',
      // preserve the existing query params in the route
      skipLocationChange: true
      // do not trigger navigation
    });
   }
}

有关更多信息,请查看this book和角度Router API


1
投票

我不得不调整Jota.Toledos回答一点,以便它适用于我,我不得不取出额外的第二个和最后一个属性 - 对象:

   navigateToFoo(){
     this._router.navigate([], {
      queryParams: {
        newOrdNum: '123'
      },
      queryParamsHandling: 'merge',
    });
   }

0
投票

你应该使用Router模块。检查这个文档:https://angular.io/guide/router

您需要导入这些模块:import { Router, ActivatedRoute, ParamMap } from '@angular/router';

© www.soinside.com 2019 - 2024. All rights reserved.