2017-12-06 6 views
1

Ich habe Probleme mit der Ausführung von Code, nachdem ein Fehler in HttpClient aufgetreten ist. Ich würde gerne wissen, wie man das Flag setzt, das ein Laden-Spinner ausschalten würde, wenn der http-Aufruf fehlschlägt. Ich bin mit RxJs 5.5.2 und Angular 5Angular HttpClient Fehlerbehandlung

private fetch(): Observable<LegalTerm[]> { 

    this.isLoading = true; 
    return this._http 
       .get<LegalTerm[]>(AppSettings.LegalTermUrl, { withCredentials: true }) 
       .do(() => this.isLoading = false) 
       .catch<any, LegalTerm>(this._trace.handleError) 
       .do(() => this.isLoading = false) 
    } 

So in dem glücklichen Weg isLoading = false funktioniert, aber nicht sicher, wie nach catch das zu tun. Es funktioniert nicht so wie der Code jetzt ist. Ich benutze auch eine benutzerdefinierte Fehlerbehandlung als pro Angular docs

public handleError<T>(operation = 'operation', error: any, result?: T) { 
    // do logging etc 
    return Observable.of(result as T); // return empty result 
} 
+0

Sie sollten 'HttpInterceptor' verwenden zu finden. –

+0

'.catch (this._trace.handleError)' ist Code, der Sie früher oder später beißen wird. Repariere es. –

Antwort

2

Sie die finally Betreiber nutzen, um die Fahne zu false auf vollständigem/Fehlerereignis zu ändern.

Dies könnte wie folgt geschehen:

import { BehaviorSubject }from 'rxjs/BehaviorSubject'; 
import 'rxjs/add/operator/finally'; 

@Component() 
export class FooComponent { 
    private loadingSub$ = new BehaviorSubeject<boolean>(false); 
    loading$ = this.loadingSub$.asObservable(); 

    constructor(private fooService: FooService){ 
    } 

    fetch(){ 
    this.loadingSub$.next(true); 
    this.fooService.getData() 
    // notice that getData() returns a stream that isnt infinite 
    .finally(()=>this.loadingSub$.next(false)) 
    .subscribe(fooData => console.log(fooData)); // error handling not considered 
    } 
} 

@Injectable() 
export class FooService { 
    constructor(private http: HttpClient){} 

    getData(): Observable<any>{ 
     // error handling not considered 
     return this.http.get('foourl'); 
    } 
} 

Weitere Informationen über den Betreiber kann here

+0

'import 'rxjs/add/operator/finally';' ist was ich brauchte, danke! – Anand