Angular路由Resolver使用问题：组件无法获取Resolver返回数据

你的问题核心是组件未正确从路由解析器中获取数据——虽然解析器能正常返回数据，但组件没有读取ActivatedRoute中存储的解析结果。以下是具体修复步骤：

1. 组件中注入ActivatedRoute #

在CreateWorkshopComponent的构造函数中注入路由激活对象：

import { ActivatedRoute } from '@angular/router';

export class CreateWorkshopComponent implements OnInit, OnDestroy{
  workShop!: WorkShop | null; 

  constructor(private route: ActivatedRoute) {} // 注入ActivatedRoute

  // ... 其他代码
}

2. 在ngOnInit中读取解析后的数据 #

在组件初始化钩子中，从路由的data对象里获取解析器返回的workShop数据：

ngOnInit(): void {
  // 方式1：直接读取快照数据（解析器完成后路由才激活，数据已就绪）
  this.workShop = this.route.snapshot.data['workShop'];

  // 方式2：订阅数据变化（适合路由复用、参数动态更新的场景）
  // this.route.data.subscribe(data => {
  //   this.workShop = data['workShop'];
  // });
}

额外检查点 #

• 确认路由配置中resolve对象的键名workShop与组件读取的键名完全一致（大小写敏感）
• 检查workShopUuid类型转换：如果路由参数是字符串格式的UUID（如'123e4567-e89b-12d3-a456-426614174000'），Number()转换会得到NaN，需调整findWorkShopByUuid的参数类型为字符串，或确保路由参数是纯数字格式

内容的提问来源于stack exchange，提问作者Orel M