Angolare 2. Come gestire gli errori 4xx con il reindirizzamento in Osservabile?

Question

Ho un servizio che chiama un'API

getItems(itemId: number): Observable<any> { 
    return this.http.get(url, headers) 
     .map(this.extractDataSingle) 
     .catch(this.handleError) 
} 

Se il server risponde con un 4xx la parte catch è chiamato. Ecco il mio metodo handleError.

private handleError = (error: any) => { 
    //Here I want to redirect to login. 
} 

Desidero reindirizzare la pagina login. La semplice digitazione di this._router.navigate(['Login']); non funziona poiché devo restituire uno Observable. Il ritorno di un osservabile vuoto return Observable.empty; non funziona, perché in questo caso si verifica un errore con i miei abbonati: Cannot read property 'subscribe' of undefined.

Come posso ottenere che reindirizzi l'utente alla pagina di accesso? Ovviamente posso cambiare i miei abbonati per captare l'errore e reindirizzare tramite i miei abbonati. Ma penso che sia meglio gestire l'errore nel mio servizio.

Sono aperto anche a soluzioni completamente diverse su come gestire gli errori 4xx.

MODIFICA: Grazie a @ GüntherZöschbauer. Il return Observable.of([]); è esattamente ciò di cui avevo bisogno. Tuttavia, essere a conoscenza di this. Al fine di avere accesso al router nel handleError metodo di utilizzo bind(this) in .catch(this.handleError.bind(this))

getItems(itemId: number): Observable<any> { 
    return this.http.get(url, headers) 
     .map(this.extractDataSingle) 
     .catch(this.handleError.bind(this)) 
} 

In caso contrario non si ha accesso al router.

Answer 1

Credo che questo fa ciò che si vuole:

private handleError = (error: any) => { 
    this._router.navigate(['Login']); 
    return Observable.of([]); 
}