链 observables 加载依赖数据答案

【问题标题】：Chain observables to load dependent datas链 observables 加载依赖数据
【发布时间】：2019-02-03 07:43:53
【问题描述】：

我正在我的解析器中加载一名员工。该员工返回城镇 ID 列表。我想在同一个解析器中加载这个城镇的 id 列表中的所有城镇。但我不想返回城镇列表，我想返回员工。加载的城镇将被添加到缓存服务中以供以后使用。这是我的代码

resolve(route: ActivatedRouteSnapshot, state: RouterStateSnapshot): Observable<any> {

    return this.employeeService.getEmployee(route.params['id'])
        .pipe(
            map(employee => {
                const townsObservables = [];
                employee['town_list'].forEach((townId) => {
                    townsObservables.push(this.townService.getTown(townId));
                });
                return forkJoin(townsObservables).pipe(
                    map(town => {
                        this.townCache.addTown(town);
                        return employee;
                    })
                );
            })
        );
}

问题：永远不会执行 forkJoin，并且我的组件中的路由快照数据返回 Observalbe 而不是员工。

route.snapshot.data['employee'] // returns Observable {_isScalar: false, source: Observable, operator: MapOperator}

如果没有管道中的所有代码，employeeService 运行良好，此代码按预期工作（我可以在我的快照数据中获取我的员工）：

resolve(route: ActivatedRouteSnapshot, state: RouterStateSnapshot): Observable<any> {
    return this.employeeService.getEmployee(route.params['id']);
}

问题：在不返回解析器的情况下加载相关数据的正确方法是什么？我正要尝试使用两个单独的解析器，但解析器无法链接（无法告诉解析器 B 使用来自解析器 A 的数据）。

我正在使用 Angular 6 和 RXJS ^6.2.1。

【问题讨论】：

标签： angular rxjs resolver angular-resolver

【解决方案1】：

如果你想订阅forkJoin，你应该使用mergeMap。

return this.employeeService.getEmployee(route.params['id'])
    .pipe(
        mergeMap(employee => { // <-- HERE changed to mergeMap
            const townsObservables = [];
            employee['town_list'].forEach((townId) => {
                townsObservables.push(this.townService.getTown(townId));
            });
            return forkJoin(townsObservables).pipe(
                map(town => {
                    this.townCache.addTown(town);
                    return employee;
                })
            );
        })
    );

map 和 mergeMap 的主要区别：

map(val => of(val)) -> 结果为Observable<Observable<val>>

mergeMap(val => of(val)) -> 结果为Observable<val>

相当于.pipe(map(val => of(val)), mergeAll())

【讨论】：