Question

我目前正在浏览Angular 2 tutorial并学习如何使用带参数的路由器通过id获取对象数据。

以下是我将要问的问题所用的代码。

以下是app.module.ts中用于根据ID

指向组件的路由定义

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

服务方法（来自Service class），用于根据id

获取数据

getHero(id: number): Promise<Hero> {
    return this.getHeroes()
    .then(heroes => heroes.find(hero => hero.id === id));
}

用于从网址中提取信息的构造函数和OnInit方法（来自显示数据的hero-details.component）

constructor(
private heroService: HeroService,
private route: ActivatedRoute,
private location: Location
){}

ngOnInit():void{
  this.route.params
    .switchMap((params:Params) => this.heroService.getHero(+params['id'])
      .subscribe(hero => this.hero = hero));
}

最后是我们提取的数据的例子.id是类型编号和名称类型字符串。

{ id: 11, name: 'Mr. Nice' }

问题：在ngOnInit中，我们将字符串中的id转换为this.heroService.getHero()调用参数中的数字。 +params['id']在转化方面的确切运作方式如何？我的猜测是，这是由于我们在app.module.ts文件中布置路线的方式，而detail/:id相当于params['id']，但我想要一个明确的探索，以便我知道我是什么我将来肯定会这样做。谢谢

Answer 1

params对象是由Angular2路由器构建和填充的构造，用于保存您在路由上指定的参数。键值对匹配：id（键）和运行时的实际路径值。参数可以包含多个参数。

你所指的加号（+ params [＆＃39; id＆＃39;]）是一个标准的javaScript运算符，它告诉解释器将param结果从它的任何类型（字符串）转换为数字。< / p>

参见此参考： https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Arithmetic_Operators#Unary_plus_(.2B)

一元加号运算符在其操作数之前，并计算其操作数，但是如果它已经没有，则尝试将其转换为数字。

+3     // 3
+"3"   // 3
+true  // 1

路线参数类型转换

1 个答案: