我如何实际捕获 NGXS 调度触发的异常？

Question

我们的项目有一个系统，如果未处理的异常到达根目录，该系统会向用户显示错误模式。 （如果重要的话，它位于 AppModule 的 @NgModule 中的 providers: [{provide: ErrorHandler, useClass: OurHandler}] 中，其中OurHandler 的 handleError 显示适当的模式。）

捕获异常通常会阻止模式。但由于某种原因，在 NGXS 调度的情况下，我所做的一切似乎都没有真正捕获异常。

一些有效的代码，作为背景：

@Injectable({ providedIn: 'root' })
class ApiService {

  constructor (private readonly http: HttpClient) {}

  doTheThing(params: Foo): Promise<string> {
    return this.http.post<string>(aUrl, params).toPromise();
  }
}

@State<ThingDoingModel>({ name: 'doing' }) // there's also some defaults here
@Injectable()
export class ThingDoingState {

  constructor (private readonly apiService: ApiService) {}

  @Action(DoTheThing)
  doTheThing(ctx: StateContext<ThingDoingModel>, { foo }: DoTheThing): Promise<string> {
    return this.apiService.doTheThing(foo);
  }
}

@Component({ /*…*/ })
class ThingComponent {

  constructor (private readonly store: Store) {}

  onSubmit() {
    this.store.dispatch(new DoTheThing(this.foo)).subscribe(() => {
      this.showSuccessModal();
    });
  }
}

这一切都很完美——只要做事成功。但是，有时 POST 可能会收到错误响应。所以我想抓住这一点，并调用 this.showErrorModal(error.message) 。这也不难，但无论我做什么，异常都会不断出现，因此我也得到了默认的未处理错误模式。

我尝试过的事情：

  onSubmit() {
    this.store.dispatch(new DoTheThing(this.foo))
      .pipe(
        catchError(err => {
          this.showErrorModal(err.message);
          return EMPTY;
        }),
      )
      .subscribe(() => {
        this.showSuccessModal();
      });
  }

  onSubmit() {
    try {
      this.store.dispatch(new DoTheThing(this.foo)).subscribe(() => {
        this.showSuccessModal();
      });
    }
    catch (err) {
      this.showErrorModal(err.message);
    }
  }

  onSubmit() {
    this.store.dispatch(new DoTheThing(this.foo)).toPromise()
      .then(() => {
        this.showSuccessModal();
      })
      .catch(err => {
        this.showErrorModal(err.message);
      });
  }

但是这些都没有真正捕获 HttpClient 获得 500 响应时抛出的异常。它们大部分都有效 - 实际的 try/catch 版本没有显示我想要的错误模式，但其他版本却显示了 - 但在所有这些中，我还得到了第二个模式我不想要。

那么我如何和/或在哪里实际捕获这个异常呢？