angular - 当内部可观察对象为空/ api 不返回数据时，mergeMap 不返回数据

Question

我正在尝试合并三个可观察对象，当内部可观察对象没有任何数据时，mergeMap 不会返回任何数据。即使内部可观察对象之一为空，我也希望能够继续该过程。我该如何处理这种情况？这是我的代码：

    ngOnInit() {
        this.accountStatusSub = this.accountService.accountNumberChange$.subscribe(
          accNumber => 
              {this.accountNumber = accNumber;


            var obs = this.accountService.getAccountDetails(this.accountNumber)
                  .pipe(mergeMap(accountData =>
                    this.accountService.getBill(accountData.account[0].accountNumber)
                      .pipe(mergeMap(billData =>
                        this.accountService.getPayment(accountData.account[0].accountNumber)
                          .pipe(map(paymentData => ({
                            address1: accountData.account[0].address1,
                            address2: accountData.account[0].address2,
                            city: accountData.account[0].city,
                            state: accountData.account[0].state,
                            zip: accountData.account[0].zip,
                            amountDue: billData.bill[0].amountDue,
                            dueDate: billData.bill[0].dueDate,
                            lastPaymentAmount: paymentData.payment[0].paymentAmount,
                            lastPaymentDate: paymentData.payment[0].paymentDate
                          })

                          ))
                      ))
                  ))


                obs.subscribe(combinedAccountData => {
                  console.log('MergeMap:', combinedAccountData)
                })

              })
          }

当 billData 或 paymentData 为空时，combinedAccountData 为空。有没有更好的方法来编写上面的代码？我是 Angular 和 rxjs 的新手。谢谢。

Answer 1

更新

理想的状态是通过

ngOnInit() {
  this.accountStatusSub = this.accountService.accountNumberChange$.pipe(
    tap(accNumber => console.log(accNumber)),
    mergeMap(accNumber => {
      this.accountNumber = accNumber;
      const getAccount = this.accountService.getAccountDetails(accNumber);
      const getBill = this.accountService.getBill(accNumber);
      const getPayment = this.accountService.getPayment(accNumber);
      return forkJoin(getAccount, getBill, getPayment);
    })
   ).subscribe();
}

原来的

如果他们可以返回空数据，您可以返回一个空对象并传播它。取决于你想要得到的结构。

ngOnInit() {
    this.accountStatusSub = this.accountService.accountNumberChange$.pipe(
        switchMap(accNumber =>
            this.accountService.getAccountDetails(accNumber),
        ),
        switchMap(accountData => combineLatest([
            of(accountData),
            this.accountService.getBill(accountData.account[0].accountNumber),
            this.accountService.getPayment(accountData.account[0].accountNumber),
        ])),
        map(([accountData, billData, paymentData]) => ({
            address1: accountData.account[0].address1,
            address2: accountData.account[0].address2,
            city: accountData.account[0].city,
            state: accountData.account[0].state,
            zip: accountData.account[0].zip,
            billData,
            ...( billData?.bill && billData.bill[0] ? {
              amountDue: billData.bill[0].amountDue,
              dueDate: billData.bill[0].dueDate,
            } : {}),
            paymentData,
            ...( paymentData?.payment && paymentData.payment[0] ? {
              lastPaymentAmount: paymentData.payment[0].paymentAmount,
              lastPaymentDate: paymentData.payment[0].paymentDate
            } : {}),
        }))).subscribe(combinedAccountData => {
            console.log('MergeMap:', combinedAccountData)
        });
}