如何根据一个值映射两个 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
我有两个可观察数组。
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