Question

是angular2的新手，我期待在当前网址没有点击事件上的所述参数时向路由器添加参数

这就是我试过的

按钮

<button (click)="onStats()">Proceed to stats </button>

现在功能

onStats(){
    let url = this.router.url;

    //here i would like to check if the router constains ?stats
    //am stuck

}

所以基本上我的网址是

locahost:4200/users/roles
localhost:4200/managers
...............

现在我想在url的末尾添加？stats如果它不存在，那么新的url将是

locahost:4200/users/roles?stats
locahost:4200/managers?stats
...........

在我的路由中，我已经设置了

{path:'user/roles:stats' , component:UserRolesStats}

我该怎么做呢

我不想硬编码routerlink =“users / roles？stats”，因为其他区域也使用此统计功能

Answer 1

检查当前查询参数

使用ActivatedRoute服务订阅当前路由的查询参数。您可以检查？stats 是否存在如下：

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

constructor(private route: ActivatedRoute) {}
private stats: boolean;    

ngOnInit() {
    this.route
      .queryParams
      .map(params => params['stats'])
      .subscribe(stats => this.stats = !!stats);
  }

要在official docs中阅读很多好的信息：

查询参数和片段也可以通过 ActivatedRoute服务。就像路由参数一样，查询参数和片段以Observable
提供

在导航期间添加查询参数

要在导航时添加查询参数，可以将NavigationExtras参数添加到.navigate()的{{1}}方法中，或将router指令添加到链接中。

来自代码：

[queryParams]

来自模板：

this.router.navigate(['/users/roles'], { queryParams: { stats: true } });

Answer 2

我使用“@ angular / router”中的“import {Router}”;“这使我可以执行以下功能。

  this.route.queryParams.subscribe((params)=> {
  //check lead Id here
  if(params['id']){
    console.log(params['id']);
  } else {
    console.log('id not found in params')
  }
});

以下是如何导航和向网址添加参数的示例链接等等。 Angular2-routing

Angular2向路由器url添加参数

2 个答案:

检查当前查询参数

在导航期间添加查询参数