我的老办法是:

queryParams(): Map<String, String> {
  var pairs = location.search.replace("?", "").split("&")
  var params = new Map<String, String>()
  pairs.map(x => {
    var pair = x.split("=")
    if (pair.length == 2) {
      params.set(pair[0], pair[1])
    }
  })

  return params
}

我的老办法是:

queryParams(): Map<String, String> {
  var pairs = location.search.replace("?", "").split("&")
  var params = new Map<String, String>()
  pairs.map(x => {
    var pair = x.split("=")
    if (pair.length == 2) {
      params.set(pair[0], pair[1])
    }
  })

  return params
}

您可以在URL中使用ActivatedRoute时获得查询参数，如下所示

url: http: / domain.com ?测试= abc

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

@Component({
  selector: 'my-home'
})
export class HomeComponent {

  constructor(private sharedServices : SharedService,private route: ActivatedRoute) { 
    route.queryParams.subscribe(
      data => console.log('queryParams', data['test']));
  }

}

当URL是这样的时候 http://stackoverflow.com?param1=value

你可以通过下面的代码得到参数1:

import { Component, OnInit } from '@angular/core';
import { Router, ActivatedRoute, Params } from '@angular/router';

@Component({
    selector: '',
    templateUrl: './abc.html',
    styleUrls: ['./abc.less']
})
export class AbcComponent implements OnInit {
    constructor(private route: ActivatedRoute) { }

    ngOnInit() {
        // get param
        let param1 = this.route.snapshot.queryParams["param1"];
    }
}

通过注入ActivatedRoute实例，可以订阅各种可观察对象，包括queryParams和params可观察对象:

import {Router, ActivatedRoute, Params} from '@angular/router';
import {OnInit, Component} from '@angular/core';

@Component({...})
export class MyComponent implements OnInit {

  constructor(private activatedRoute: ActivatedRoute) {}

  ngOnInit() {
    // Note: Below 'queryParams' can be replaced with 'params' depending on your requirements
    this.activatedRoute.queryParams.subscribe(params => {
        const userId = params['userId'];
        console.log(userId);
      });
  }

}

关于取消订阅的说明

@Reto和@codef0rmer已经非常正确地指出，根据官方文档，组件onDestroy()方法中的unsubscribe()在这种情况下是不必要的。这已从我的代码示例中删除。(请参见本教程中的蓝色警告框)

我希望它能帮助到其他人。

上面的问题指出，在页面被重定向后，查询参数值是需要的，我们可以假设快照值(不可观察的替代方案)就足够了。

这里没有人从官方文档中提到snapshot. parmmap .get。

this.route.snapshot.paramMap.get('id')

所以在发送之前，在发送/重定向组件中添加这个:

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

然后重定向(这里有文档):

this.router.navigate(['/heroes', { id: heroId, foo: 'foo' }]);

或者仅仅是:

this.router.navigate(['/heroes', heroId ]);

确保你已经在你的路由模块中添加了这个，如下所示:

 { path: 'hero/:id', component: HeroDetailComponent }

最后，在需要使用查询参数的组件中

添加导入(此处有文档): import {Router, ActivatedRoute, ParamMap} from '@angular/ Router '; 注入ActivatedRoute

(文档也导入了switchMap，也注入了Router和HeroService——但它们只在可观察的替代中被需要——当你使用快照替代时就不需要了，就像我们的例子一样):

    constructor(
      private route: ActivatedRoute
    ) {}

并得到你需要的值(文档在这里): ngOnInit () { const id = this.route.snapshot.paramMap.get('id'); ｝

注意:如果你将路由模块添加到一个特性模块中(如文档中所示)，请确保在app .MODULE.ts中，路由模块在import:[]中位于AppRoutingModule(或其他具有根级应用路由的文件)之前。否则将找不到特征路由(因为它们会出现在{path: '**'， redirectTo: '/ NOT - FOUND '}之后，并且你只会看到NOT - FOUND消息)。