2017-05-09 5 views
10

Próbuję dodać spinner ładujący do każdego żądania kończącego się w Angular 2, więc rozszerzyłem usługę Http nazywając ją HttpService. Po każdym żądaniu chciałbym wywołać funkcję finally() po złapaniu błędów, aby móc zatrzymać spinner ładujący.Dlaczego funkcja finally() nie działa po przechwytywaniu w Observable in Angular 2?

Ale maszynopis mówi:

[ts] Własność 'wreszcie' nie istnieje w rodzaju 'Obserwowalne'.

import { AuthService } from './../../auth/auth.service'; 
import { Injectable } from '@angular/core'; 
import { Http, XHRBackend, RequestOptions, RequestOptionsArgs, Request, Response, Headers } from '@angular/http'; 

import { Observable } from 'rxjs/Observable'; 
import 'rxjs/add/operator/catch'; 
import 'rxjs/add/observable/throw'; 

@Injectable() 
export class HttpService extends Http { 

    constructor(
     backend: XHRBackend, 
     options: RequestOptions, 
     private authservice: AuthService 
    ) { 
     super(backend, options); 
     this.updateHeaders(options.headers); 
    } 

    request(url: string|Request, options?: RequestOptionsArgs): Observable<Response> { 
     return super.request(url, options) 
      .catch((response: Response) => this.authError(response)) 
      .finally(() => { 
       // ... 
       /* Do something here when request is done. For example 
       finish a spinning loader. */ 
      }); 
    } 

    private authError(response: Response) { 
     if (response.status === 401 || response.status === 403) { 
      this.authservice.logout(); 
     } 
     return Observable.throw(response); 
    } 

    private updateHeaders(headers: Headers) { 
     headers.set('Content-Type', 'application/json'); 
     if (this.authservice.isloggedIn()) { 
      headers.set('Authorization', `Bearer ${this.authservice.getToken()}`); 
     }   
    } 
} 

Jak mogę uruchomić niektórych kodu po każdym żądaniu http jak to? Jaki jest najlepszy sposób na zrobienie tego?

+0

trzeba importować 'finally'. Powinno wystarczyć pytanie z odpowiedziami, które to wyjaśniają. –

Odpowiedz

25

zapomniałeś go importować:

import 'rxjs/add/operator/finally'; 
+0

dziękuję. Otrzymałem błąd "w końcu nie jest funkcją" i dodanie tego importu rozwiązało moje problemy. –

+0

Pracowałem dla mnie! – Sami

Powiązane problemy