使用angular router路由传递数据

如何在路由时传递数据？

第一种方式：在查询参数中传递数据           /product?id=1&name=2    =>     ActivatedRoute.queryParams[id]  

　　传递方式：/product?id=1&name=2

　　目标组建中接收参数方式： ActivatedRoute.queryParams[id]                //获取id的值

第二种方式：在路由路径中传递数据      { path:/product/:id }    =>    /product/1    =>    ActivatedRoute.params[id]

　　定义路由路径时指定路由的名字，如： { path:/product/:id }

　　实际的路径中携带参数，如：/product/1

　　路由的目标组件中接收参数，如： ActivatedRoute.params[id]

　　（1.修改路由中的path属性，使其可以携带参数；）

　　（2.修改路由链接的参数来传递数据）

　　（3.接收参数）

第三种方式：在路由配置中传递数据    {path:/product, component:ProductComponent, data:[{isProd:true}]}    =>    ActivatedRoute.data[0][isProd]

　　在路由配置中，通过data参数定义静态的数据，可定义多个对象     {path:/product, component:ProductComponent, data:[{isProd:true}]}   

　　在目标组建中接收参数  ActivatedRoute.data[0][isProd]

参数快照

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

参数订阅subscribe()

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