读取参数然后在 Angular 中找到单个元素

Question

我有一个服务 carriersService，方法 getAll()，returns 一个 Observable<Carrier[]>。 在我的组件中，我正在尝试读取路由参数 carrierId，找到具有此类 carrierId 的运营商并将其分配给局部变量

let carrier = null;

this.route.paramMap.pipe(
      switchMap(
        (params: ParamMap) => this.carriersService.getAll()));

我需要使用 params.get('carrierId') 从 Carrier[] 的 Observable 中找到单个 Carrier，并将其分配给本地 carrier 变量。

Answer 1

combineLatest 将在两个 observable 都发出后发出，这允许您使用路由参数在数组中找到载体。

combineLatest(
  this.route.paramMap.pipe(map(p => p.get('carrierId'))),
  this.carriersService.getAll()
).pipe(
  map(([carrierId, carriers]) => carriers.find(carrier => carrier.id === carrierId))
).subscribe(carrier => {
  this.carrier = carrier;
});