2016-07-24 7 views
0

でサービスからの応答を処理し、次のように私は私のサービスで機能を持って次のようにAngular2コンポーネント

addObject(name: string, path: Array<google.maps.LatLngLiteral>, cycle: string, type: string, size: string) { 
    let obj = new SurveyObjectModel(name, path, cycle, type, size); 

    let body = JSON.stringify(obj); 
    let headers = new Headers({ 'Content-Type': 'application/json; charset=utf-8', 'Authorization': 'Token ' + localStorage.getItem('auth_token') }); 
    let options = new RequestOptions({ headers: headers }); 
    console.log(body); 
    console.log(headers); 
    return this.http.post(this._surveyObjectURL, body, options) 
    .map(this.extractData) 
    .catch(this.handleError) 
    } 

は現在、私は私のコンポーネントでそれを処理しています:

createExhibitionSuveyObject(data: any){ 

    this.exhibitionSurveyObjectService.addObject(
     data.name, data.farmer_email, 
     data.farmer_name, data.size, data.path, data.cycle, data.object_type).subscribe(

     response => this.exhibitionSurveyObjects = response, 
     error => this.errorMessage = <any>error 

    ); 
    } 

を私が処理したいが成功と失敗を独立して(つまり、成功すれば警告を表示し、失敗したらエラーメッセージを表示したい)。角度で

と同様に我々が持っていた:

// Simple GET request example: 
$http({ 
    method: 'GET', 
    url: '/someUrl' 
}).then(function successCallback(response) { 
    // this callback will be called asynchronously 
    // when the response is available 
    }, function errorCallback(response) { 
    // called asynchronously if an error occurs 
    // or server returns response with an error status. 
    }); 

私はこれをどのように達成することができますか?私は今、成功とエラーに対してアクションを実行することができていますか、私はただの構文を知らなかったです

UPDATE

createExhibitionSuveyObject(data: any){ 

    this.exhibitionSurveyObjectService.addObject(
     data.name, data.farmer_email, 
     data.farmer_name, data.size, data.path, data.cycle, data.object_type).subscribe(

     response => {this.exhibitionSurveyObjects = response; console.log("response")}, 
     error => {this.errorMessage = <any>error; console.log("error")} 

    ); 
    } 

+0

あなたはそれを独立して扱いたいですか? 'addObject'や' createExhibitionSuveyObject() 'では? –

+0

それが適切であれば、それはサービスで扱う方が理にかなっていると思いますよね? – Nitish

+0

"どこにいても適切です"というのはあなたの呼び出しです。 'createExhibitionSuveyObject'は既にそれを独立して処理しています。 '.catch(this.handleError)'は干渉するかもしれません。 –

答えて

2

インラインで実行することも、グローバルなhttpエラーをキャッチするためにExceptionHandlerオブジェクトを使用することもできます。

あなたのインラインコードはかなり古いです。ここでは例です:

this.http.post(url, body, requestOptions).subscribe(
      data => { 
       let j = data.json(); 
       console.log('here is the json!', j); 
      }, 
      error => { 
       alert('oh no'); 
      } 
); 

あなたがexceptionHandlerのを使用したい場合は、あなたがこのような何か必要があります:あなたのブートストラップでは

を:

ブートストラップでも
import { ExceptionHandler } from '@angular/core'; 
import { CustomExceptionHandler } from './INSERT-PATH/custom-exception-handler'; 

... 
provide(ExceptionHandler, { useClass: CustomExceptionHandler }) 
... 

custom-exception-handler.ts:

import { ExceptionHandler, Injectable } from '@angular/core'; 
import { Response } from '@angular/http'; 

@Injectable() 
export class CustomExceptionHandler { 
    constructor() { 
    } 

    call(error, stackTrace = null, reason = null) { 
     if (error instanceof Response) { 
      alert('oh dear, an HTTP error occurred'); 
     } else { 
      alert('unhandled error'); 
     } 
    } 
} 

この例では、エラーがインラインで処理されていない場合、CustomExceptionHandlerが発生することに注意してください。だからあなたのHTTP呼び出しでerror =>{}ビットをしないでください:)

関連する問題