如何将 routerLink queryParams 设置为属性值？答案

【问题标题】：How to set routerLink queryParams to property value?如何将 routerLink queryParams 设置为属性值？
【发布时间】：2016-10-02 18:40:17
【问题描述】：

我需要通过组件属性为routerLink设置[queryParams]，即

@Component({
   ...
   template: '<a [routerLink]="..." [queryParams]="queryParams | async">...</a>
   ...
})
export class MyComponent {
   ...
   queryParams: any;
   ...
   constructor(route: ActivatedRoute) {
      this.queryParams = route.queryParams;
      ...
   }
}

但是这种方法不起作用，路由没有附加查询参数。我错过了什么？

【问题讨论】：

那里真的需要async 管道吗？
this.queryParams 有什么价值？
这是一个BehaviorSubject，如果我订阅它并登录到控制台，我会得到Object {datum: "19-10-2016"} datum : "19-10-2016" __proto__ : Object

标签： angular angular2-routing angular2-router3

【解决方案1】：

您可以使用正确的语法附加查询参数

  this.router.navigate([yourRouteName], {queryParams:{ida:1,Idb:2,Idc:3}});

或

<a [routeLink]="yourRouteName, {queryParams:{ida:1,Idb:2,Idc:3}}"

然后您可以使用以下语法接收查询参数

import { Router, Route, ActivatedRoute } from '@angular/router';    
ngOnint{
        this.IDA= this.router.routerState.snapshot.root.queryParams["Ida"];
        this.IDB= this.router.routerState.snapshot.root.queryParams["Idb"];
        this.IDC= this.router.routerState.snapshot.root.queryParams["Idc"];
    }

希望这会对你有所帮助。

【讨论】：