如何根据一个值映射两个 Observable 数组?

How to map two Oberservable arrays based on a value?

我有两个可观察数组。

habits$: Observable<Habit[]>;
status$: Observable<Status[]>;

习惯具有以下结构:

export interface Habit {
  habitId: number;
  name: string;
  repeatVal: number;
  notification: string;
  color: string;
  question: string;
  id: number;
}

status 数组以 habitId、date 和 status 作为键。

我想根据两者中存在的 habitId 属性将 habits$ 和 status$ 合并到一个 Observable 数组中。

我做了一些研究,合并 mergeMap() 和 forkJoin() 似乎是可行的方法,如此处所示

但我想不出适合我的语法。

这是我的代码目前的样子:

ngOnInit() {
this.habits$ = this.habitService.fetchAllById(this.authService.userId);
console.log(this.habits$);
this.status$ = this.statusService.fetchAll();
this.habits$.pipe(
  mergeMap(habits => {
  this.status$ = this.statusService.fetchAll().filter(status => status.habitId == habits.habitId);
}));
console.log(this.joined$);}

我将按以下方式使用 forkJoin:

ngOnInit() {
  forkJoin([
    this.habitService.fetchAllById(this.authService.userId),
    this.status$ = this.statusService.fetchAll()
  ]).subscribe(([habits, statuses]) => {
    this.joined = habits.map(habit => ({
      ...statuses.find(t => t.habitId === habit.habitId),
      ...habit 
    }));
  });
}

见简单demo