Angular rxjs forkjoin 无法解析链式 observable 数组答案

【问题标题】：Angular rxjs forkjoin does not resolve array of chained observableAngular rxjs forkjoin 无法解析链式 observable 数组
【发布时间】：2021-03-27 02:23:30
【问题描述】：

我正在使用 Angular 10 并尝试使用 forkJoin 处理多个 API 调用。 API 调用是在一个函数中定义的，我还需要在该函数中处理 API 结果，然后解析每个 Promise。我想实现所有这些函数的组合结果返回。但是，forkJoin 永远不会被解决。我究竟做错了什么。我的代码如下：

const promises = [];   
for (let i = 0; i < bulkImportSets.length; i++) {
promises.push(
          this.policyService.importPolicy({files: bulkImportSets[i]}, this.selectedFiles)
      );
}
this.value$ = forkJoin(promises);




  importPolicy( policies, filesMetadata): Observable<any> {

        let result: { data: { items: { data: any[]; result_code: string } } } = null;

        return new Observable( (observer) => {
            const url = `${COMMON.LEGACY_API_PATH}sep/import/policy`;

            /*
             * This is done this way to send data via multipart/form-data
             * */
            const fd = new FormData();
            fd.append('policies', new Blob([JSON.stringify(policies)], {
                type: 'application/json'
            }));

            this.baseService.postData(url, fd).subscribe(
                (resolve) => {
                    result = resolve['data'];
                    observer.next(result);
                },
                (error) => {
                    result = getServiceFailureResponseJson(policies, filesMetadata, error);
                    observer.next(result);
                }
            );
        } );

    }

在错误情况下，数据需要使用 'getServiceFailureResponseJson' 进行转换并仍然得到解决。

postData是一个http客户端调用方法：

postData(url: string, data?: any, params?: any): Observable<import("@angular/common/http").HttpEvent<any[]>>;

【问题讨论】：

那是因为仅仅.next 是不够的。你也应该.complete你的观察者。在next 之后添加complete 调用，它会起作用。在大多数情况下，如果您使用 new Observable(... 构造函数，您可能做错了什么。有很多方法/运算符可以为您工作

标签： angular typescript rxjs observable rxjs-observables

【解决方案1】：

固定的 importPolicy 方法是

importPolicy( policies, filesMetadata): Observable<any> {

        const fd = new FormData();
            fd.append('policies', new Blob([JSON.stringify(policies)], {
                type: 'application/json'
            }));

        return this.baseService.postData(url, fd).pipe(
           map(resolve => resolve.data),
           catchError(error => of(getServiceFailureResponseJson(policies, filesMetadata, error)))
       );
    

    }

与您的代码的不同之处在于它是使用 rxjs fns 编写的，并且会自动完成。所有其他行为都是一样的

【讨论】：

这个问题应该在baseService.postData实现中
我更新了地图功能，点击获取结果数据。