Question

我正在尝试在Angular应用程序中使用AngularFire库。某些AngularFire调用返回承诺，我希望将它们作为可观察对象处理，而不是为了确保整个应用程序的一致性。我正在使用rxjs v6

使用from()效果很好，并且可以提供预期的行为，除非发生错误。

如果promise抛出异常，则可观察对象似乎看不到它，并且堆栈跟踪被转储到控制台中，并显示Error: Uncaught (in promise)。

我的第一次尝试

返回Promise的AngularFire调用：

deleteCampaign(id: string) {
  return from(this.campaignCollection.doc(id).delete());
}

呼叫代码：

    deleteCampaign(id: string) {
        return this.dataStorageService.deleteCampaign(id)
        .pipe(
            catchError(
                err => {
                    console.log('error when deleting campaign');
                    console.log(err);
                    return throwError(err);
                }
            )
        );
    }

在这种情况下，我在控制台中获得了堆栈跟踪，并且catchError从不触发。

我的第二次尝试

我在catch内部的诺言中添加了from，然后尝试将错误重新抛出为可观察到的，所以看起来像这样：

    deleteCampaign(id: string) {
        return from(this.campaignCollection.doc(id).delete().catch(
            err => {
                throwError(err);
            }
        ));
    }

我的第三次尝试

很像第二次尝试，但是我尝试抛出一个普通的javascript错误。但是，这导致了相同的堆栈跟踪，而且也没有被可观察者拾取。

    deleteCampaign(id: string) {
        return from(this.campaignCollection.doc(id).delete().catch(
            err => {
                throw(err);
            }
        ));
    }

这停止了堆栈跟踪的发生，因为现在诺言正在捕获它，但是调用代码仍然永远看不到错误。

我会以错误的方式处理吗？我假设通过使用from()可以在可观察对象中进行所有错误处理，而我可以不做任何承诺。

我需要能够： 1.在返回承诺的地方没有错误处理代码，让可观察的对象负责。 1.使promise catch块能够抛出可观察到的错误。

解决方法到了：

在前端组件中，使用error中的subscribe回调处理传递的错误

  onDelete(id: string) {
    this.loadingCampaigns = true;
    this.campaignService.deleteCampaign(id).subscribe(
      _ => {},
      err => {
        console.log('error detection from the component');
      }
    );
  }

从广告系列服务中，tap()错误，以便可以记录该错误或以其他方式记录该错误：

    deleteCampaign(id: string) {
        return this.dataStorageService.deleteCampaign(id)
        .pipe(
            tap(null, () => {console.log('tapped the error');} ),
        );
    }

最后，从数据存储组件什么都不做：

    deleteCampaign(id: string) {
        return from(this.campaignCollection.doc(id).delete());
    }

Answer 1

您可以将错误回调附加到Observable.subscribe()。

Rx.Observable.from(Promise.reject('Boo!'))
    .subscribe(val => {
        console.log('success');
    },
    err => {
        console.log(err);
    });
// Boo!

Answer 2

deleteCampaign(id: string) {
  return from(this.campaignCollection.doc(id).delete()).pipe(catchError(err=>{
      return throwError(err);
    }))
}

deleteCampaign(myid).susbcribe(res=>{
    console.log(res);
},error=>{
    console.log(error)
})

我举了一个使用ng-bootstrap模态的示例-在打开模态时返回一个诺言-转换为this stackblitz中的Observable

处理from（）创建的Observable中诺言抛出的错误

2 个答案: