離子角：創建通用的HTTP錯誤處理程序

Question

我是新來angular2，我做我的HTTP請求是這樣的：

this.http.get(...).map(res=>res.json()).subscribe(data=>{ 
    //..do something 
},err=>{ 

    if(err.status == 400){ 
     this.presentToast('Validation error'); 
    }else if(err.status == 403){ 
     this.presentToast('Authorization error'): 
    }else if(err.status == 500){ 
     this.presentToast('Something wrong with server'); 
    }else ... 
}); 

我想自定義消息爲每個用戶可以瞭解常見狀態代碼，但問題是我寫這些if和else塊給我的每個http請求，並且在每個ts文件中我都有，所以基本上我在每個ts文件中導入ToastController並寫入函數。

是否有無論如何做一個通用的錯誤處理程序的裝飾方式，它將自定義規則/消息作爲敬酒，並使其乾燥？

Answer 1

您可以通過創建一個共同的可觀察這樣做：

您common.ts都會有這樣的方法：（說，這部分是CommonProvider在寫CommonProvider類）。

httpGetCall(url){ 
    return Observable.create(observer => { 
     this.http.get(url) 
     .map(res => res.json()) 
     .subscribe(data => { 
      console.log("Your data : " , data); 
      observer.next(data); 
     },(err) => { 
      console.log("Your error : ", err); 
      observer.error(err); 
      if(err.status == 400){ 
       this.presentToast('Validation error'); 
      }else if(err.status == 403){ 
       this.presentToast('Authorization error'): 
      }else if(err.status == 500){ 
       this.presentToast('Something wrong with server'); 
      }else ... 
     }); 
    }); 
} 

從您的調用方法，你可以這樣做：

@Component({ 
    templateUrl: "<your-html-path/code>", 
    providers: [CommonProvider] 
}) 
export class YourPage{ 
    constructor(private common: CommonProvider){ 
     this.common.httpGetCall(<url>) 
     .subscribe(data => { 
      //..do something 
     },(err) => { 
      //.. Any other operation or nothing to do as toast action is already done. 
     }) 
    } 
} 

雖然，這是以防萬一，你需要一個通用的處理程序。