HTTPレスポンスをJSONにマッピングしてJSONをモデルにマッピングする問題

Question

httpレスポンスをJSONにマップし、そのJSONの一部をTicketインターフェイスにマッピングしようとしています。私のチケットのインターフェイスで必要です。私のアプリは何の問題もなくコンパイルされますが、REST機能をテストするとランタイムエラーが発生しますが、レスポンスのログを正常にコンソールに出力できるため、問題はバックエンドではありません。私がここで間違って何をしているのか？

My error: 

    vendor.bundle.js:8137 Angular is running in the development mode. Call enableProdMode() to enable the production mode. 
    main.bundle.js:553 TypeError: res.json(...).map is not a function 
     at MapSubscriber.project (main.bundle.js:1330) 
     at MapSubscriber._next (vendor.bundle.js:42853) 
     at MapSubscriber.Subscriber.next (vendor.bundle.js:4709) 
     at XMLHttpRequest.onLoad (vendor.bundle.js:47289) 
     at ZoneDelegate.webpackJsonp.749.ZoneDelegate.invokeTask (polyfills.bundle.js:2478) 
     at Object.onInvokeTask (vendor.bundle.js:9228) 
     at ZoneDelegate.webpackJsonp.749.ZoneDelegate.invokeTask (polyfills.bundle.js:2477) 
     at Zone.webpackJsonp.749.Zone.runTask (polyfills.bundle.js:2245) 
     at XMLHttpRequest.ZoneTask.invoke (polyfills.bundle.js:2540) 


My code: 

    retrieveTicket(barcode: string) : Observable<any> { 
      return this.http.get(`${this.API_URL}POS/RetrieveTicket/${barcode}`, this.options) 
      .map((res: Response) => res.json().map(ticket => {   
       Object.assign({ 
        ResponseCode: ticket.ResponseCode, 
        CustomError: ticket.CustomError, 
        ticketDate: ticket.POSTicket.Date, 
        ticketTime: ticket.POSTicket.EndTime, 
        cashierName: ticket.POSBarCode.POSCashier_Name, 
        tranNo: ticket.POSTicket.TranNo, 
        tranValue: ticket.POSTicket.ScanValue, 
        securityChecked: ticket.POSBarCode.SecurityChecked 
       }) as ITicket})   
     ) 
      .catch((error: any) => Observable.throw(error || 'server error')); 
     } 


my interface: 

     import { BaseRequestInterface } from './base-request.interface'; 

     export interface ITicket extends IBaseRequest { 
      ticketDate: string; 
      ticketTime: string; 
      cashierName: string; 
      tranNo: string; 
      tranValue: string; 
      timeSincePurchase: string; 
      securityChecked: boolean; 

      export function setTicket(obj?: any) { 
       super(); 
       this.ResponseCode = obj && obj.ResponseCode || null; 
       this.CustomError = obj && obj.CustomError || null; 
       this.ticketDate = obj && obj.ticketDate || null; 
       this.ticketTime = obj && obj.ticketTime || null; 
       this.cashierName = obj && obj.cashierName || null;   
       this.tranNo = obj && obj.tranNo || null; 
       this.tranValue = obj && obj.tranValue || null; 
       this.timeSincePurchase = obj && obj.timeSincePurchase || null; 
       this.securityChecked = obj && obj.securityChecked || null; 
      } 


     } 

my BaseRequest Interface: 

// Base request class that returns from BRMService API 
export interface IBaseRequest { 
    // Public properties available 
    BaseURI?: string; 
    CustomError?: string; 
    ProviderName?: string; 
    RequestFormData?: string; 
    RequestURI?: string; 
    ResponseCode?: number;  
} 

Answer 1

EDIT：

我々は同じように行われることになるではなく、オブジェクトの配列よりも、ひとつのオブジェクトを扱うので、TicketModelを入力してオブジェクトをマッピングしていることを学んだ、次の（短縮）：

retrieveTicket(barcode: string) { 
    return this.http.get(...) 
    .map(res => res.json()) 
    .map(res => ({ResponseCode:res.ResponseCode, CustomError:res.CustomError}) as TicketModel) 
} 

インタフェース：

export interface TicketModel { 
    ResponseCode: number; 
    CustomError:string 
} 

DEMO

---

オリジナルのポスト：あなたはとにかく、私はあなたがインターフェイスを使用することをお勧め、あなたのTicketModelのクラスやインタフェースを使用している場合

不明は;）そして、あなたは簡単にマッピングすることができます着信データ（短縮版）：

.map((res:Response) => res.json().map(x => 
    Object.assign({ResponseCode: x.ResponseCode, 
        CustomError:x.CustomError}) as TicketModel))) 

あなたの応答はitemsの内側に入った配列を持つオブジェクトである場合は、ちょうどでitemsを追加します。私は私の質問の下に私のticketModelを追加

.... res.json().items.map(...