2017-11-15 11 views
1

私はTypeScript、Angular 5.0を使用しています。マイバックエンドの応答は、このインタフェースに要約されている:サーバーからデータを取得するために私のサービスで角度/イオン - ハンドルJSON "error"プロパティ

export interface JSONResponse { 
    error?: { 
    code: number, 
    message: string 
    }; 
    data?: {}; 
} 

機能は次のとおりです。

httpGet(url: string, httpParams: HttpParams) { 
    return new Promise((resolve, reject) => { 
    this.http.get<LoginResponse>(url, {params: httpParams}) 
     .subscribe(res => { 
     resolve(res.data); 
     }, err => { 
     // handle http get related errors here 
     console.log(err); 
     }); 
    }); 
} 

そしてテンプレートをレンダリングするためにこのサービスを消費するコンポーネント:

buttonClicked(event) { 
    this.myService.httpGet('myAPIurl', someRequestParams) 
    .then((data) => { 
     this.myData = data; 
    }, (err) => { 
     console.log(err); 
    }); 
} 

私のバックエンドからの応答のエラーチェックを処理する場所はどこですか?

つまり、プロパティーdataが存在する場合、応答は成功し、自分のデータを適切に処理します。プロパティerrorが存在する場合は、コード/メッセージエラーをユーザーに通知します。

+0

今の問題は何ですか? – Sampath

+0

私はJSON解析を実行するコード内の場所を特定し、データまたはエラーフィールドが存在するかどうかをチェックし、最終的にはUIで処理されたデータまたはエラーを通知しようとしています –

+0

なぜできませんあなたは '(err)=> { console.log(err);' 'buttonClicked()'イベントでそれをここで行いますか? – Sampath

答えて

0

より一般的な方法で行う必要がある場合は、IonicErrorHandlerを使用できます。

IonicErrorHandlerは、イオン性のDevの サーバーを構築を使用するときにオーバーレイとして して表示ランタイムエラーを処理するデフォルトのコンソールのエラーをインターセプトします。

import { NgModule, ErrorHandler } from '@angular/core'; 
import { IonicErrorHandler } from 'ionic-angular'; 

@NgModule({ 
    providers: [{ provide: ErrorHandler, useClass: IonicErrorHandler }] 
}) 
class AppModule {} 

あなたはそれをカスタマイズしたい場合は、あまりにもそれを行うことができます。

class MyErrorHandler implements ErrorHandler { 
    handleError(err: any): void { 
    // do something with the error 
    } 
} 

@NgModule({ 
    providers: [{ provide: ErrorHandler, useClass: MyErrorHandler }] 
}) 
class AppModule {}