angular路由传值 补充-小记

在 Angular 中，你可以使用多种方式在路由之间传递值。下面是一些常见的方式：

1、路由参数（Route Parameters）：通过在路由配置中定义参数，然后在导航时传递该参数。在目标组件中，可以使用 ActivatedRoute 服务来获取该参数的值。

// 路由配置
{ path: 'user/:id', component: UserComponent }

// 导航
this.router.navigate(['/user', userId]);

// 在 UserComponent 中获取参数值
constructor(private route: ActivatedRoute) {
  this.route.params.subscribe(params => {
    const userId = params['id'];
    // 使用 userId 进行相应的操作
  });
}

2、查询参数（Query Parameters）：通过在导航 URL 中添加查询参数来传递值。在目标组件中，可以使用 ActivatedRoute 服务来获取查询参数的值。

// 导航
this.router.navigate(['/user'], { queryParams: { id: userId } });

// 在 UserComponent 中获取查询参数值
constructor(private route: ActivatedRoute) {
  this.route.queryParams.subscribe(params => {
    const userId = params['id'];
    // 使用 userId 进行相应的操作
  });
}