路由传值

路由传递参数

写法

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

<!--  使用查询 参数  [queryParams]={} 传递数据-->

url

http://127.0.0.1:4200/?id=1

取值

this.activatedRoute.snapshot.queryParams['id']

路由路径中传递参数

 {path: 'product/:id', component: ProductComponent},
  /**
   * 修改路由 使其可以携带参数
   */

<a [routerLink]="['/product',1]">商品详情</a>

this.route.navigate(['/product', 2]);

link  值的数组中 填充要传递的值

url

http://127.0.0.1:4200/product/1

取值

 this.activatedRoute.snapshot.params['id'];
  ```


## 参数订阅 使用镜像时只创建一次  但是使用订阅的时候是创建一个订阅对象，当观察对象状态发生改变的时候订阅者接受改变的值

this.activatedRoute.params.subscribe((p: Params) => console.log(p[‘id’]));

> 路由配置中传递数据

使用data 参数定义静态的对象 配置静态数据

获取数据 this.activatedRoute.data.forEach(x => console.log(x));

可能存在与 在路由路径中传递参数冲突
“`