Angular 2: http.get in Observable not handling error

Question

Я использую наблюдаемые для Http-вызовов, которые работают нормально, но затем я изменил свои контроллеры и заметил, что мой код, по-видимому, не обрабатывает ошибки.

Вот посмотрите на код из моей службы (SellingMenuService):

public getVarieties(): Observable<any> { 
    return this.http.get(this.varietyListUrl).map(response => { 
     return response.json(); 
    }, (error: any) => { 
     console.log(error); 
     console.log('error finding variety list'); 
     // TODO: implement error handling here. 
    }); 
} 

А вот соответствующий код моего компонента:

constructor(public sellingMenuService: SellingMenuService) { } 

getVarietyList(): void {   
    this.sellingMenuService.getVarieties().subscribe(res => {    
     console.log(res); 
     this.varieties = res; 
    });   
} 

А вот некоторые ошибки в моей консоли :

Если у меня возникла ошибка 500, не должны ли пострадать эти консольные журналы с моего сервиса выше? Почему бы и нет?

Answer 1

У вас возникла ошибка в обработке ошибок map().

import 'rxjs/add/operator/catch'; 

return this.http.request(request) 
    .map(res => res.json()) 
    .subscribe(
    data => console.log(data), 
    err => console.log(err), 
    () => console.log('yay') 
); 

См: How to catch exception correctly from http.request()?

Answer 2

Вы пытаетесь поймать ошибку в методе map, в то время как вы должны делать это в subscribe.

public getVarieties(): Observable<any> { 
    return this.http.get(this.varietyListUrl).map(response => { 
     return response.json(); 
    }).subscribe((res: any) => { 
     console.log(res); 
    }, (error: any) => { 
     console.log(error); 
     console.log('error finding variety list'); 
     // TODO: implement error handling here. 
    }); 
} 

Вы также можете добавить третий параметр к наблюдаемому. Она будет решена, когда наблюдаемым является finalized:

public getVarieties(): Observable<any> { 
    return this.http.get(this.varietyListUrl).map(response => { 
     return response.json(); 
    }).subscribe((res: any) => { 
     console.log(res); 
    }, (error: any) => { 
     console.log(error); 
     console.log('error finding variety list'); 
     // TODO: implement error handling here. 
    },() => { 
     console.log("finalized") 
    }); 
} 

Вы можете прочитать здесь: http://reactivex.io/rxjs/class/es6/Observable.js~Observable.html