Bir Çözümleyici'de hata nasıl işlenir

Question

Daha iyi bir UX yapmak için çözücüler kullanmaya çalışıyorum. Her şey mutlu yolda harika çalışır. Anlayamadığım şey istisnaların nasıl ele alınacağıdır. Çözümleyicim, bir webapi projesine vuran bir hizmeti çağırıyor. Bir örnek:

FooResolver:

resolve(route: ActivatedRouteSnapshot, state: RouterStateSnapshot): Observable<Foo> { 
     return this.fooService.getById(route.params['id']).catch(err => { 
    ****not sure what to do/return in the case of a server error**** 
    return Observable.throw(err); 
    }); 
} 

FooService:

public getById(id: string): Observable<Foo> { 
    return this.http.get(`${ this.apiUrl }/${ id }`) 
     .map(this.extractData) 
     .catch(this.handleError); 
} 

HandleError fonksiyonu:

protected handleError (error: Response | any) { 
    // Todo: Log the error 
    // Errors will be handled uniquely by the component that triggered them 
    return Observable.throw(error); 
} 

FooComponent: hatası (atma denedim

ngOnInit(): void { 
    this.foo= this.route.snapshot.data['foo']; 
    if (this.foo) { 
     this.createForm(this.foo); 
    } 
} 

FooComponent İçinde, ben bu (bu bir hata durumunda isabet asla hizmet/Resolverde döndü) do

yakalanmamış (sözden): -) gösterildiği gibi konsolunda bu durum almak durumuyla Yanıtı: 500 iç sunucu hatası URL için:

özelliği okunamıyor

sunucuda istisnalar yaşayabilirsiniz hepsi birkaç çözücüler, sahip tanımsız

arasında 'abone' Ama 'don: vermektedir

ve new Observable<Foo>() dönen, Bu istisnalar durumunda ne yapacağını bilmiyorum. Şunları yapabilirsiniz

import { Injectable } from '@angular/core'; 
import { Resolve, ActivatedRouteSnapshot, RouterStateSnapshot, Router } from '@angular/router'; 

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

import { IProduct } from './product'; 
import { ProductService } from './product.service'; 

@Injectable() 
export class ProductResolver implements Resolve<IProduct> { 

    constructor(private productService: ProductService, 
       private router: Router) { } 

    resolve(route: ActivatedRouteSnapshot, 
      state: RouterStateSnapshot): Observable<IProduct> { 
     let id = route.params['id']; 
     if (isNaN(+id)) { 
      console.log(`Product id was not a number: ${id}`); 
      this.router.navigate(['/products']); 
      return Observable.of(null); 
     } 
     return this.productService.getProduct(+id) 
      .map(product => { 
       if (product) { 
        return product; 
       } 
       console.log(`Product was not found: ${id}`); 
       this.router.navigate(['/products']); 
       return null; 
      }) 
      .catch(error => { 
       console.log(`Retrieval error: ${error}`); 
       this.router.navigate(['/products']); 
       return Observable.of(null); 
      }); 
    } 
} 

:

Answer 1

ile tamamlar dair bir gözlemlenebilir dönmek gerekir Gunter anlaşılacağı tekniği kullanılarak, hata işleme ile benim çözücülerinin birinin bir örnektir Buradaki tam örneği burada bulabilirsiniz: APM-final klasöründe https://github.com/DeborahK/Angular-Routing.

Answer 2

Sen Burada false

handleError() { 
    return Observable.of([false]); 
}