title: Angular (4): Custom Error Handler & DI: Cannot instantiate cyclic dependency
body: <p>I'm trying to inject an Angular Material 2 element into a custom error handler I wrote, but I keep getting this error:</p>
  
  <pre><code>Cannot instantiate cyclic dependency! ApplicationRef ("[ERROR -&gt;]"): in NgModule AppModule in ./AppModule@-1:-1
  </code></pre>
  
  <p>This is the error handler class:</p>
  
  <pre><code>@Injectable()
  export class CustomErrorHandler implements ErrorHandler {
  
    constructor(private snackBar: MdSnackBar) {
    }
  
    handleError(error: any): void {
      //FIXME: display popup
      console.error('Error occurred!');
      console.error(error);
      this.snackBar.open('Application Error: ' + error, 'X', {
        duration: environment.snackBarTime,
      });
    }
  
  }
  </code></pre>
  
  <p>This is the providers part of app.module</p>
  
  <pre><code>providers: [
      SearchService,
      CompanyService,
      MdSnackBar,
      PopupService,
      AuthService,
      LoginService,
      AuthGuard,
      ErrorService,
      TokenStorageService,
      BankService,
      CountryService,
      {provide: ErrorHandler, useClass: CustomErrorHandler},
      {provide: HTTP_INTERCEPTORS, useClass: AuthInterceptor, multi: true},
    ],
    exports: [
      TranslateModule
    ],
    bootstrap: [AppComponent]
  })
  </code></pre>