応答を処理するために、Angular2（Typescript）でParser Classを作成することはできますか？

Question

私はAngular 2（Typescript）でコンポーネントとサービスを作ることができ、コンポーネントのレスポンスを解析できることを知っていますが、私のアーキテクチャはレスポンスの変更と同様に以下のようにしたいと思います。 ：

サービス：APIコールを呼び出して応答をフェッチします。応答メソッドを持っています。

パーサー：レスポンスを取得し、レスポンスを解析し、応答を使用可能な形式でコンポーネントに返します。

コンポーネント：パーサからの応答を取得し、表示するデータを表示します。

私はサービスから観測可能なものを使用しており、それをパーサーで購読しています。パーサーから観測可能なものを使用し、それをコンポーネントでサブスクライブします。

しかし、その間に多くのエラーが発生します。私は何か踏み切れないか、それとも問題に適切なアプローチをしていますか？コードの追加

：あなたがしたいよう

コンポーネント:::

サービス:::

import { Observable } from 'rxjs/Observable'; 
import { IRequest } from './api.interaction.interface'; 
import { Http, Headers, RequestOptions, Response } from '@angular/http'; 
import { Injectable } from '@angular/core'; 
import 'rxjs/add/operator/map'; 
import 'rxjs/add/operator/do'; 
import 'rxjs/add/operator/catch'; 

@Injectable() 
export class ApiInteractionService { 
// Constructor Function 
constructor(private _http: Http) { 
} 
getApiResponse(p_attr: IRequest): Observable<Response> { 
    // Set request url 
    let _authenticationUrl: string = p_attr.url; 
    // Set request body 
    let _body: any = p_attr.body; 
    // Set content type to JSON 
    let _headers = new Headers(p_attr.header); 
    // Set a request option 
    let _options = new RequestOptions({ headers: _headers }); 

    return this._http[p_attr.method](_authenticationUrl, _body, _options) 
     .map((response: Response) => response.json()) ///... change response to JSON format 
     .do((data:any) => console.log('All : ' + JSON.stringify(data))) //... console response 
     .catch((error: any) => Observable.throw(error.json().error || 'Server error')); //...errors if any 
}} 

PARSER :::

import { Injectable, Component } from '@angular/core'; 
import { Observable } from 'rxjs/Observable'; 
import { IRequest } from './../services/api.interaction.interface'; 
import { ApiInteractionService } from './../services/api.interaction.service'; 

@Injectable() 
export class AuthenticateParser { 
private _authenticationToken: string = ''; 
// Constructor Function 
constructor(private _authenticationService: ApiInteractionService) { 
} 
// Fetches Authentication Token 
setAuthenticationToken(): void { 
    let p_url: string = 'http://10.5.214.82:8443/auth/authenticate'; 
    let p_body: Object = { 
     "userId": "admin", 
     "password": "admin" 
    }; 
    let p_header: Object = { 
     "Content-Type": "application/json" 
    }; 
    let p_attrs: IRequest = { 
     'method': 'post', 
     'url': p_url, 
     'body': p_body, 
     'header': p_header 
    }; 
    this._authenticationService.getApiResponse(p_attrs) 
     .subscribe(
     response => this.parseSuccessResponse(response), 
     error => this.parseErrorResponse(error) 
     ); 
    } 
    // Parses Token response and sets it. 
    parseSuccessResponse(p_response: any): void { 
     this._authenticationToken = p_response.data; 
    } 
    // Parses Error response and sets it. 
    parseErrorResponse(p_error: any): void { 
     this._authenticationToken = p_error.data; 
    } 
    // returns authentication token 
    getAuthenticationToken():string { 
    return this._authenticationToken; 
    } 
} 

Answer 1

サウンズサービスとしてのパーサー。あなたがサンプルコードを書いたなら、助けになったでしょうか？

パーサーでhttp.get応答を購読して応答を解析し、結果を件名に公開することができます。次に、あなたのコンポーネントでパーサからサブジェクトにサブスクライブします。あなたのパーサのようなものになります

：あなたのコンポーネントに今

import { Injectable, OnInit} from '@angular/core'; 
import { Subject } from 'rxjs/Subject'; 
import {YourService} from '....'' 

@Injectable() 
export class ParseService implements OnInit { 
    public parseSubject: Subject<any> = new Subject <any>(); 
    constructor(private service: YourService) {} 
    ngOnInit(){ 
    this.service.yourGetFunction() 
     .map(res=> res.json()) 
     .subscribe(
      response => { 
       parse logic that stores result in parsedObj 
       parseSubject.next(parsedObj); 
      }, 
      error => { this.errorMessage = <any>error}); 
    } 
} 

、あなたはParseServiceをインポートし、これは私がのYourService用ませプロバイダをエラーなし与え解析された出力