Angular распознаватель

Question

Я создаю преобразователь для моих маршрутов, следуя документации по этому вопросу.

export class PlaceDetailResolverService implements Resolve<Place> {
  constructor(private api: ApiService, private router: Router) {}

  resolve(route: ActivatedRouteSnapshot): Observable<Place> | Observable<never> {
    let id = route.paramMap.get("id");

    return this.api.getPlace(id);
  }
}

, а затем в компоненте

ngOnInit(): void {
  this.route.data.subscribe((data: { place: Place }) => {
    console.log(data);

    this.place = data['PlaceDetailResolverService'];
  });
}

Разделитель работает в том смысле, что он правильно выбирает данные, но для доступа к нему в компоненте я должен использовать его, который не используется в документации и звучит не очень элегантно для меня. Чего мне не хватает?

data['PlaceDetailResolverService']

Соответствующая часть модуля маршрутизации

{
  path: "places/:id",
  component: PlaceComponent,
  resolve: {
    PlaceDetailResolverService
  }
}

Answer 1

Вы можете просто добавить свой собственный ключ, который сопоставляется с определенным c распознавателем, например так:

{
  path: "places/:id",
  component: PlaceComponent,
  resolve: {
    yourKey: PlaceDetailResolverService,
  }
}

Внутри PlaceComponent вы можете получить к нему доступ через

export class PlaceComponent {
  constructor(
    private readonly _route: ActivatedRoute,
  ) {
    const place = this._route.data.subscribe((data) => {
      const place = data.yourKey;
    })
  }
}