Angular 2 beobachtbare bricht, wenn Callback-Logik hinzugefügt

Question

ich habe folgende Login-Funktion:

login(payload: Object) { 
    return this.http.post(this.apiUrl, payload) 
     .map(res => res.json()) 
     .catch((error: any) => Observable.throw(error.json().error || 'Server error')); 
    } 

Ich nenne es wie folgt auf Login und es funktioniert gut:

this.sk_auth.login(this.loginCreds).subscribe((response)=>{ 
     console.log(response); 
     //here we can do anything we want with the response. 
    if(response.success){ 
     sessionStorage.setItem('token', response.token); 
     sessionStorage.setItem('user', JSON.stringify(response.user)); 

    }); 

Das Problem ist, dass ich etwas tun, bevor ich die Antwort zurückgebe. Ich versuchte dies:

login(payload: Object) { 
    return this.http.post(this.apiUrl, payload) 
     .map(res => res.json()) 
     .map((res)=>{ 
     //do some stuff... 
     }) 
     .catch((error: any) => Observable.throw(error.json().error || 'Server error')); 
    } 

Wenn ich die zweite Karte hinzufügen die beobachtbare Reaktion nicht mehr auf die Zeichnung auf der Login-Komponente zurückgegeben wird. Danke im Voraus.

Answer 1

Sie müssen den Operator 'do' verwenden Sie können über grundlegende rxjs-Operatoren für angularJS-Entwickler lesen, die mit $ q in meinem Beitrag vertraut sind. $Q map to RxJS

Answer 2

Wenn Sie mehr als eine Sache machen wollen, können Sie Versprechungen verwenden.

login(payload: Object) { 
    return this.http.post(this.apiUrl, payload) 
     .toPromise() 
     .then(this.extractData) 
     .then(this.doSomeStuff) 
     .catch(this.handleError); 
} 
private extractData(res: Response) { 
    let body = res.json(); 
    return body || []; 
} 
private doSomeStuff(body: any) { 
    //do some stuff... 
    return theStuff; 
} 
private handleError(error: any) { 
    Observable.throw(error.json().error || 'Server error'); 
} 

Answer 3

Es ist gelöst. Ich habe das Ergebnis in der zweiten Kartenfunktion nicht zurückgegeben. (Schlägt meine Stirn!)

login(payload: Object) { 
    return this.http.post(this.apiUrl, payload) 
     .map(res => res.json()) 
     .map((res)=>{ 
     //do some stuff... 
     return res; 
     }) 
     .catch((error: any) => Observable.throw(error.json().error || 'Server error')); 
    }