Question

我正在尝试在我的Angular 5应用程序中获取URL参数，我发现了两种方法：

1）使用paramMap

    ngOnInit() {
      this.hero$ = this.route.paramMap
        .switchMap((params: ParamMap) =>
          this.service.getHero(params.get('id')));
    }

2）使用params

    ngOnInit() {
      this.sub = this.route.params.subscribe(params => {
        this.id = +params['id'];
      });
    }

有什么区别吗？哪一个是最好的做法？

Answer 1

根据文件：

仍有两个较旧的属性。他们的能力低于他们的替代者，气馁，并且可能在未来的Angular版本中被弃用。

params - 包含特定于路径的必需参数和可选参数的Observable。请改用 paramMap 。

简单而有效！

Answer 2

实际上没有区别，但 params 已经过时了，很快就会被弃用

paramMap

包含必需和可选地图的Observable 特定于路线的参数。地图支持检索单个和来自同一参数的多个值。

queryParamMap

一个Observable，包含可用的查询参数的映射所有路线。地图支持检索单个和多个值来自查询参数。

Answer 3

注意： paramMap 为使用route参数提供了更多便利。具有以下三种方法：

有（）
get（）
getAll（）

有（）：示例：

    this.router.navigate(['example', id]); 

     this.activatedRoute.paramMap.subscribe(params => {
          console.log(params.has('id')); // true
        })

get（）： 示例：

       this.router.navigate(['example', "id","another ID"]); 

     this.activatedRoute.paramMap.subscribe(params => {
          console.log(params.get('id'));
        })

getAll（）： 示例：

     this.router.navigate(['example', { foo: ['bar', 'baz'] } ]);

     this.activatedRoute.paramMap.subscribe(params => {
          console.log(params.getAll('foo'));
        })

Angular 4/5 - 路线paramMap vs params

3 个答案: