Angular HTTP Interceptor, der einen Dienst verwendet

Question

Ich versuche, die Vorteile der neuen HTTP Interceptor-Funktionalität in Angular 4.3+ zu nutzen. Ich habe den Abfangjäger gut funktioniert. Aber ich möchte die Fehler abfangen und eine Nachricht im Toast-Stil mit angular2-toaster ausgeben. Ich habe die gesamte Toast-Funktionalität in einen Dienst gestellt, ToasterNotificationService. Aber wenn ich versuche, diesen Dienst im Interceptor zu verwenden, funktionieren die Dinge nicht so gut.

Wenn ich gerade versuche, die ToasterNotificationService im Interceptor zu verwenden, indem ich es im Konstruktor initialisiere, erhalte ich einen Fehler von No provider for xxx. Wenn ich also die Injector von @angular/core importiere, diese im Konstruktor initialisiere und dann versuche, manuell eine Instanz der ToasterNotificationService zu injizieren, stirbt die Anfrage. Wie es buchstäblich stoppt und nie an den Server gesendet wird. Hier ist ein Beispiel meiner intercept Funktion in meinem Interceptor:

intercept (req: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> { 
    console.log(req); 
    const toaster = this.injector.get(ToasterNotificationService); 


    return next.handle(req) 
     .do((ev: HttpEvent<any>) => { 
      if (ev instanceof HttpResponse) { 
       console.log('ev in the do: ', ev); 
      } 
     }) 
     .catch((response: any) => { 
      if (response instanceof HttpErrorResponse) { 
       console.log('response in the catch: ', response); 
       toaster.error('Unexpected Error', response.error.message); 
      } 

      return Observable.throw(response); 
     }); 
} 

Wenn dies zu tun, die console.log on line 2 funktioniert, aber dann die Anfrage stirbt. Es werden keine Fehler in der Konsole oder in meinem Terminal angezeigt, und die Anfrage trifft den Server nie.

Wenn ich nur die zwei Zeilen kommentieren, die auf den Toaster verweisen, wird die Anfrage an den Server weitergeleitet.

Hat jemand irgendwelche Ideen, was ich tun kann, um dieses Problem zu umgehen?

bearbeiten

Hier ist der Anbieter Abschnitt meiner app.module.ts wo ich diese beiden Dienste erklären:

providers: [ 
    ToasterNotificationService, 
    { 
     provide: HTTP_INTERCEPTORS, 
     useClass: ErrorInterceptorService, 
     multi: true, 
    } 
] 

Ich habe versucht, die ToasterNotificationService vor und nach der Erklärung der HTTP_INTERCEPTORS

Answer 1

habe ich herausgefunden das Error. Ich importierte das ToasterService von angular2-toaster und benutze es in meiner Gewohnheit ToasterNotificationService, aber erklärte das nie in der providers10 für meine App. Nachdem alle drei Dienste deklariert waren, funktionierte alles wieder wie erwartet.