连接两个可观察对象并删除重复项

Question

我在Angular9中调用了两个服务方法如下：

var u1 = this.userService.getByDepartmentId(departmentId).pipe(
  map((payload: Payload<GetByDepartmentIdModel[]>) => 
    payload.result.map((user: GetByDepartmentIdModel) => { 
      return {
        id: user.id, 
        forename: user.forename, 
        surname: user.surname 
      };
    })));

var u2 = this.userService.getByStoreId(storeId).pipe(
  map((payload: Payload<GetByStoreIdModel[]>) => 
    payload.result.map((user: GetByStoreIdModel) => { 
      return {
        id: user.id, 
        forename: user.forename, 
        surname: user.surname 
      };
    })));

方法 getByDepartmentId 和 getByStoreId returns 和 Observable<Payload<GetByDepartmentIdModel[]> 和 Observable<Payload<GetByStoreIdModel[]>>.

如何加入两个响应 u1 和 u2 并删除重复项（比较 user.id）？

Answer 1

您可以使用 forkJoin.

const users = new Subject();
forkJoin([u1, u2]).subscribe([u1, u2] => {
    if (u1.id === u2.id) {
        users.next(u1);
    } else {
        users.next(u1);
        users.next(u2);
    }
});

并订阅 users。

users.subscribe(user => ...);

PS：请注意，forkJoin 会等待两个 observable 完成。也许您想改用 combineLatest 或 zip。在此处了解更多信息：https://scotch.io/tutorials/rxjs-operators-for-dummies-forkjoin-zip-combinelatest-withlatestfrom

PS：请不要使用var。使用 const 或 let.

Answer 2

好吧，你首先使用 forkJoin 来组合 observables，然后你用 filter 做一个基本的数组方法 concat，将它映射到你想要的对象，然后你已完成：

forkJoin([
  this.userService.getByDepartmentId(departmentId),
  this.userService.getByStoreId(storeId)
]).pipe(
  map(([ depPayload, storePayload ]) => depPayload.result.concat(storePayload.result)
    .filter(({ id }, i, arr) => arr.findIndex((subj) => subj.id === id) === i)
    .map(({ id, forename, surname }) => ({ id, forename, surname })
);

连接两个可观察对象并删除重复项

Join two observables and remove duplicates

rxjs

typescript

angular

angular9