angular - ngrx 组件存储效果在 promise 错误后不会触发

Question

我的实现

大家好， 我正在为我的 supabase 项目使用 ngrx 组件存储， supabase中有一个delete方法可以删除特定的行， 如果删除(这是一个 promise )一个出错的产品， 我正在 tapResponse 中处理该异常。

readonly deleteProduct$ = this.effect(
    (
      productID$: Observable<string>
    ): Observable<PostgrestResponse<Product>> => {
      return productID$.pipe(
        switchMap((productID) =>
          this._supabaseService.delete<Product>(
            productsPath,
            'id',
            productID,
          )
        ),
        tapResponse(
          ({ data: products, error }) => {
            this.patchState({
              loading: false,
              error,
            });
            this.deleteProduct(products[0]?.id);
            this.toastSuccessMessage(error, 'Deleted Successfully!');
            this.handleError(error);
          },
          (error: Error) => {
            this.handleError(error);
          }
        ),
       catchError(() => EMPTY)
      );
    }
  );

问题

如果我的deleteProduct$效果出错， 我的订阅被关闭了，我不知道为什么， 之后，如果我再次执行deleteProduct$效果，它不会触发

我的猜测

我认为该错误不是通过 catchError 产生的，因此我的订阅已关闭，但我不知道如何解决此问题。

我希望我已经说清楚了， 如果没有，我会尽力说清楚。

我非常感谢您提供的任何帮助。

Answer 1

您应该捕获 HTTP 请求中的错误，而不是主流中的错误。 否则主流将被取消。

这是一个示意性示例:

loadProduct$ = this.effect(productId =>
  productId.pipe(
    switchMap(productId =>
      // pipe is applied to the response
      this.httpService.get(productId).pipe(
        tapResponse(
          product => {
            this.patchState({ product });
          },
          error => {
            this.handleError(error);
          }
        )
      )
    )
  )
);

PS。这个问题对于 NGRX 效果来说也很常见。