नक्शा कैसे प्रतिक्रिया वस्तु

Question

हाय मैं एक angular2 सेवा जिसका काम है इस प्रकार एक WebAPI जो एक json वस्तु संरचना में डेटा रिटर्न कॉल करने के लिए बनाया है Angular2 में प्रत्यक्ष मानचित्र समारोह का उपयोग कर एक टाइपप्रति वस्तुओं के लिए HTTP सेवा द्वारा दिया:

//Result of the webapi service call. 
{ 
    "Total":11, 
    "Data":[{"Id":1,"Name":"A","StartDate":"2016-01-01T00:00:00"}, 
    {"Id":2,"Name":"B","StartDate":"2016-02-01T00:00:00"}] 
} 

यहां मेरी कोणीय 2 सेवा है। GetMileStones विधियां पूरी तरह से काम करती हैं और मैं प्रतिक्रिया को माइलस्टोन [] पर वापस डालने में सक्षम हूं। लेकिन पेज किए गए डेटा को प्राप्त करने के लिए मैंने एक फ़ंक्शन getPagedMileStones (int, int) बनाया है जो वेबपै विधि को कॉल करता है और उपर्युक्त संरचना के अनुसार परिणाम लौटाता है। मैं वेबपी से आईपीएड रेस्पॉन्स में लौटाई गई प्रतिक्रिया डालना चाहता हूं। लेकिन मैं इसे ठीक से काम करने में सक्षम नहीं हूं। मेरे पास एक इंटरफ़ेस IPagedResponse है और मैं यह फ़ंक्शन इस जानकारी को घटक कॉलिंग पर वापस लौटने के लिए चाहता हूं ताकि मैं पेजिंग कार्यक्षमता प्रदान कर सकूं।

   import { MileStoneModel} from './milestoneModel' 
       import { Http, Response, Headers, RequestOptions } from '@angular/http' 
       import { Injectable } from '@angular/core' 
       import { Observable }  from 'rxjs/Observable'; 

       import {PaginatePipe, PaginationService, PaginationControlsCmp, IPaginationInstance} from 'ng2-pagination'; 
       import 'rxjs/Rx'; 

       export interface IPagedResponse<T> { 
        total: number; 
        data: T[]; 
       } 

       export interface DataModel { 
        id: number; 
        data: string; 
       } 

       @Injectable() 
       export class MileStoneService //implements IPagedResponse<MileStoneModel> 
       { 

        data: MileStoneModel[]; 
        //private _page: number = 1; 
        total: number; 

        private pagedResult: IPagedResponse<MileStoneModel>; 

        mileStones: MileStoneModel[] 
        private url: string = "http://localhost/ControlSubmissionApi/api/Milestones"; 
        constructor(private http: Http) { 


        } 
        getMilestones(): Observable< MileStoneModel[]> { 

         return this.http.get(this.url) 
          .map((response: Response) => <MileStoneModel[]>response.json())    
          .catch(this.handleError); 


        } 
     ***getTypedPagedMilestones(page: number, pageSize: number) { 
         debugger; 
         return this.http.get(this.url + "/" + page + "/" + pageSize) 
          .map((res: Response) => { this.data = <MileStoneModel[]>res.json().Data; this.total = res.json().Total; }) 
          //.map((Data, Total) => { console.log(Data); console.log(Total); })*** 
          .catch(this.handleError); 


        } 

        getMilestone(id: number):Observable< MileStoneModel> { 

         return this.http.get(this.url+"/"+id) 
          .map((response: Response) => <MileStoneModel>response.json()) 
          .catch(this.handleError); 

        } 
        searchMileStones(name: string): Observable<MileStoneModel[]> { 
         let headers = new Headers({ 'Content-Type': 'application/json' }); 
         let options = new RequestOptions({ headers: headers }); 
         return this.http.get(this.url+"/search/"+name) 
          .map((response: Response) => <MileStoneModel[]>response.json()) 
          .catch(this.handleError); 
        } 
        addMileStone(formdata:string) { 
         //let body = JSON.stringify({ newMileStone }); 
         let headers = new Headers({ 'Content-Type': 'application/json' }); 
         let options = new RequestOptions({ headers: headers }); 

         return this.http.post(this.url, formdata, options) 
          .map((response: Response) => <MileStoneModel>response.json())   
          .catch(this.handleError); 

        } 
        private handleError(error: any) { 
         // In a real world app, we might use a remote logging infrastructure 
         // We'd also dig deeper into the error to get a better message 
         let errMsg = (error.message) ? error.message : 
          error.status ? `${error.status} - ${error.statusText}` : 'Server error'; 
         console.log(errMsg); // log to console instead 
         return Observable.throw(errMsg); 
        } 

       } 

Answer 1

यह काम नहीं करेगा? मुझे लगता है कि IPagedResponse

का एक प्रकार

pageResponse: IPagedResponse<MileStoneModel>; 

    getTypedPagedMilstones(page: number, pageSize: number): Observable<IPagedResponse<MileStoneModel>> { 
     return this.http.get(this.url + "/" + "/" + pageSize) 
      .map((res: Response) => { 
       this.pageResponse.data = <MileStoneModel[]>res.json(); 
       this.pageResponse.total = res.json().Total; 
      }) 
      .catch(this.handleError); 
    } 

Answer 2

getPagedMilestones(page: number, pageSize: number): Observable<IPagedResponse<MileStoneModel>> { 

    return this.http.get(this.url + "/" + page + "/" + pageSize) 
     .map((response: Response) => { 
      return { 
       data: <MileStoneModel[]>response.json().Data, 
       total: response.json().Total 
      } 
     }) 
     .catch(this.handleError); 
}