Angular 2 @angular/router 3.0.0-alpha.7 - 访问多个参数 [英] Angular 2 @angular/router 3.0.0-alpha.7 - Accessing Multiple Parameters

问题描述

我只是在尝试最近发布的 Angular 2 中的新路由器，即 Angular 2 @angular/router 3.0.0-alpha.7

I am just trying the new router in Angular 2 announced recently i.e. Angular 2 @angular/router 3.0.0-alpha.7

我知道在新路由器中我们可以使用以下代码访问路由参数:

I know that in new router we can access route parameters using below code:

this.activatedRoute.params
            .map(params => params['id'])
            .subscribe((id) => {

             //use param id

             });

谁能指导我们如何处理路由中有多个参数的情况?

Can anyone please guide how do we handle the case in which we have multiple multiple parameters in our route?

我的意思是我们如何从路由中检索多个参数的值.

I mean how do we retrieve the values of multiple parameters from route.

推荐答案

一种方法是使用 参数处理和解构像这样:

One way you could do it is using Parameter handling and Destructuring like this:

this.activatedRoute.params
  .map(params => [params['id'], params['p2'], params['p3']]) <== pass desired array
  .subscribe(([id, p2, p3]) => { <== destructuring params
      //use param id, p2 or p3
   });

另见此处的 HeroDetailComponent 组件 http://plnkr.co/edit/JtuOAZsZPhkn1CISQaO9?p=preview

See also HeroDetailComponent component here http://plnkr.co/edit/JtuOAZsZPhkn1CISQaO9?p=preview

或者你可以写得简单一点:

Or you can write a bit simple:

this.activatedRoute.params
  .subscribe(({id, p2, p3}) => { <== destructuring params
      //use param id, p2 or p3
   });

Plunker 示例(HeroDetailComponent)

Plunker sample (HeroDetailComponent)

这篇关于Angular 2 @angular/router 3.0.0-alpha.7 - 访问多个参数的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！