Angular Material SnackBar 和自定义 ErrorHandler 来通知错误

Question

我有一个错误自定义处理程序类，它实现了 Angular 5 核心的 ErrorHandler。如果发生错误，handleError 方法必须通知它发送一个显示的快餐栏材料组件。 如果错误是在测试按钮中抛出的，一切都很好。

如果错误发生在 ngOnInit 方法上，snackbar 将无法正常工作，它会显示在页面的错误位置，您无法再将其关闭。

I.E.

我的组件：

导出类 RootPageComponent 实现 OnInit { 构造函数（）{} 公共按钮测试（）{ 它发生了； } ngOnInit() { 它发生了； } }

这是我的自定义错误处理程序：

导出类 ErrorHandlerCustom 扩展 ErrorHandler { 构造函数（...）{} 处理错误（）{ 常量 notificationService = this.injector.get(NotificationService); // 使用snackbar材质的通知自定义 notificationService.exceptionError(error); } }

ngOnInit 中出现错误的结果： ngOnInit error

点击测试按钮： click on test button

Answer 1

我终于找到了问题所在。我不知道这是否正确。

在很多情况下，错误处理程序会在 Angular 的区域之外运行。这会导致 toast 无法正常运行，因为没有在其上运行更改检测。所以需要在正常运行时使用zone。

this.zone.run(() => { this.snackBar.open(message, "UNDO"); }

在这里我找到了我的解决方案并发布它以防其他人遇到同样的问题： https://github.com/angular/material2/issues/9875

Answer 2

就我而言，解决方案是使用this.handleError.bind(this)，如下所示：

  public post<T>(url: string, data: any, options?: HttpOptions): Observable<T> {
    return this.http.post<T>(this.baseUrl + url, data, options).pipe(
      map((res: T) => {
        return res as T;
      }),
      catchError(this.handleError.bind(this))
    );