首页 > 解决方案 > 使用 switchmap 和 forkjoin 链接 observables 不能按预期工作 angular typescript rxjs

问题描述

我目前正在创建尝试创建一个系统,如果我成功更新了一个请求,我会在 forkjoin 中触发 3 个可观察对象,然后一旦这些对象完成 console.log('complete/or finish') 否则如果它不是什么都不做。目前虽然可观察对象在 forkjoin 完成之前就完成了,但我完全不知道发生了什么,

  copyAttachments(): Observable<any> {
    if (this.model.attachments.length > 0) {
      return this.attachmentService.copyAttachments(this.model.attachments, this.model.id);
    }
    return empty();
  }

  uploadAttachments(): Observable<any> {
    this.showAttachmentsUploadingModal = true;
    const formData = new FormData();

    if (this.formAttachments.length > 0) {
      this.showAttachmentsUploadingModal = true;
      this.formAttachments.forEach(file => {
        formData.append('files', file, file.name);
      });
    }

    // uploading empty formData will still trigger creation of default folder structure
    return this.attachmentService.uploadAttachments(formData, this.model.id);
  }

  uploadCustomerData(): Observable<any> {
    this.showAttachmentsUploadingModal = true;
    const formData = new FormData();

    if (this.formCustomerData.length > 0) {
      this.showAttachmentsUploadingModal = true;
      this.formCustomerData.forEach(file => {
        formData.append('files', file, file.name);
      });
      return this.attachmentService.uploadCustomerData(formData, this.model.id);
    }

    return empty();
  }

handleAttachments(): Observable<any> {
    return forkJoin
      (
        this.copyAttachments(),
        this.uploadCustomerData(),
        this.uploadAttachments()
      )
  }

  updateRequest() {
    this.myservice
      .updateRequest(this.model)
      .pipe(
        switchMap((saveResult: boolean) => {
          this.showSubmittingModal = false;
          if (saveResult === true) {
            return this.handleAttachments();
          } else {
            return empty();
          }
        }),
      )
      .pipe(finalize(() => {
        console.log('finish')
      }))
      .subscribe(
        response => {
          // todo: do anything with this response from uploadAttachments()?
          this.showAttachmentsUploadingModal = false;
        },
        error => {
          location.reload();
        },
        () => {
          console.log('complete')
        }
      );
  }

预期的结果是我的服务完成,然后我的 forkjoin observables 完成,然后它将 console.log('finish')

目前的结果是服务完成。它 console.logs('finish') 然后我的 forkjoin 触发器

标签: javascriptangularjstypescriptrxjsobservable

解决方案


我发现这个问题的解决方案不是返回 empty() 或 of() 你需要返回一个空对象作为 observable 这样 Forkjoin 仍然保持值所以 return of({}) 并且一切都很好


推荐阅读