angular路由详解三（路由参数传递）

我们经常用路由传递参数，路由主要有三种方式：

第一种：在查询参数中传递数据

{path:"address/:id"}   => address/1  => ActivatedRoute.param[id]

　　在路由中传递

　　<a [routerLink] = "['/address',1]"></a>

　　点击事件传递

　　this.router.navigate([‘/address’,2])

　　//在不同等级页面跳转可以用snapshot（快照方式）

　　this.id = this.routeInfo.snapshot.params["id"]

　　//相同组件跳转需要使用subscribe(订阅方式)

　　 this.routeInfo.params.subscribe((params: Params) => this.id = params["id"]  )

第二种：在路由路径中传递参数数据

<a [routerLink] = "['/address']" queryParams= "{id:1}"></a>

this.id = this.routeInfo.snapshot.queryParams["id"]//拿到路由中的参数

 

第三种：在路由配置中传递数据

{path:'home', component: HomeComponent，data:[{isPush:true}] }  => ActivatedRoute.data[0][isPush]

　　//同样也是有snapshot和subscribe两种类型

　　this.isPush = this.routeInfo.snapshot.data[0]["isPush"]