Angular 6错误处理不显示敬酒答案

【问题标题】：Angular 6 Error Handling not showing toastsAngular 6错误处理不显示敬酒
【发布时间】：2018-11-23 07:56:49
【问题描述】：

我正在使用下面的代码来捕获我的小型 Angular 6 应用程序中的错误...我正在捕获错误，我在控制台中显示信息问题是敬酒不显示，除非我单击应用程序中的某个位置，他们不会自己出现。我在应用程序的其他部分使用 ToastrService，每当我像在这里一样调用它时，它都会显示 toats，而无需单击任何内容。

知道是什么导致了这种行为吗？

import { Injectable, ErrorHandler, Injector } from '@angular/core';
import { Router } from '@angular/router';
import { HttpErrorResponse } from '@angular/common/http';
import { ToastrService } from 'ngx-toastr';
import { AppSettings } from '../../app.settings';

@Injectable()
export class GlobalErrorHandler implements ErrorHandler {

  constructor(private injector: Injector) {}

  public handleError(error: any) {

    const router = this.injector.get(Router);
    const settings = this.injector.get(AppSettings)

    const toastr = this.injector.get(ToastrService);

    console.log(`Request URL: ${router.url}`);
    console.log(error);
    if (error instanceof HttpErrorResponse) {
      console.log("it is");
      if (error.status === 401) {
        router.navigate(['/login']);
        settings.settings.setLoadingSpinner(false);
        toastr.error('Logged in user no longer authenticated on server.', 'Unable to connect to server');
      } else if (error.status === 404) {
        console.log("it is 404");
        toastr.error('Unable to connect to server. Missing or wrong URL, please try again', 'Unable to connect to server');
        settings.settings.setLoadingSpinner(false);
      } else if (error.status === 0) {
        toastr.error('Server appears to be temporary unavailable', 'Unable to connect to server');
        settings.settings.setLoadingSpinner(false);
      } else if (error.status === 500) {
        toastr.error('Server appears to be temporary unavailable', 'Unable to connect to server');
        settings.settings.setLoadingSpinner(false);
      }

    } else {
      console.error(error);
      toastr.error('An error has occured', 'Sorry');

    }

  }

}

我在模块中添加了提供程序，也将此类用作错误处理程序。

【问题讨论】：

如果您能提供Minimal, Complete, and Verifiable example，那就太好了。您可以使用StackBlitz 创建一个。

标签： javascript angular typescript angular-toastr

【解决方案1】：

请在构造函数中包含烤面包机服务并运行。根据我的理解，当服务被实例化时，烤面包机应该被启动。

【讨论】：

如果我这样做，我会收到一个错误：提供程序解析错误：无法实例化循环依赖！

【解决方案2】：

我相信您可以在构造函数中导入并包含 NgZone 以按预期完成这项工作：

constructor(private injector: Injector, private zone: NgZone) {}

然后包装您的 toastr 电话：

this.zone.run(() => toastr.error('message', 'title'));

【讨论】：