Angular 4, konwersja odpowiedzi http obserwowalnej do obserwowanego obiektu

Question

Jestem nowicjuszem pojęć obserwowalnych i potrzebuję pomocy przy konwersji.
Mam usługę, która zwraca Observable<Response> z żądania Http, ale muszę go przekonwertować do Observable<PriceTag>, aby go użyć na DataSource wewnątrz metody connect.
Czy mimo to można to zrobić?

Jest to metoda z moich usług:

getPriceTags(): Observable<Response> { 

    // Set the request headers 
    const headers = new Headers({ 'Content-Type': 'application/json' }); 

    // Returns the request observable 
    return this.http.post(Constants.WEBSERVICE_ADDRESS + "/priceTag", null, {headers: headers}); 

} 

I tu jest klasa DataSource gdzie muszę zwrócić go jako Observable<PriceTag>:

export class PriceTagDataSource extends DataSource<PriceTag> { 

    constructor (private priceTagService: PriceTagService) { 
     super(); 
    } 

    connect(): Observable<PriceTag> { 

     // Here I retrieve the Observable<Response> from my service 
     const respObs = this.priceTagService.getPriceTags(); 

     // Now I need to return a Observable<PriceTag> 

    } 

    disconnect() {} 

} 

Oto przykład z odpowiedzi od mojego żądanie:

{ 
    // This object is used to check if the query on the server was sucessful 
    "query": { 
     "sucessful": true 
    }, 

    // These are my PriceTags 
    "tags": [ 
     { 
      "id": "1", 
      "name": "MAIN" 
     }, 
     { 
      "id": "2", 
      "name": "CARD" 
     } 
    ] 
} 

Answer 1

Od kąta 4.3 można to zrobić automatycznie.

Przykład:

export class SomeService { 
    constructor(private http: HttpClient) {} // <--- NOTE: HttpClient instead of Http 

    getSome(): Observable<MyAwesomeObject> { 
     return this.http.get<MyAwesomeObject>.get('myUrl'); 
    } 
} 

Tak więc w Twoim przypadku to będzie:

return this.http.post<PriceTag>(Constants.WEBSERVICE_ADDRESS + "/priceTag", null, {headers: headers});

Ponownie użyć HttpClient zamiast Http

Answer 2

wystarczy zmienić Observable<Response> na Observable<PriceTag>

Tego typu odlewy są przeznaczone do maszynopisu, aby upewnić się, że wysyłasz/oczekujesz odpowiednich typów.

EDIT

import { PriceTag } from 'your-path-to-model'; 

getPriceTags(): Observable<Response> { 
    // Set the request headers 
    const headers = new Headers({ 'Content-Type': 'application/json' }); 

    // Returns the request observable 
    return this.http.post(Constants.WEBSERVICE_ADDRESS + "/priceTag", null, {headers: headers}) 
    .map((res: Response) => { 
     return new PriceTag(res.json()); 
    }); 
} 

Answer 3

Chyba odpowiedź HTTP jest JSON zawierający pricetag? Problem polega na tym, że chcesz utworzyć obiekt PriceTag. Możesz po prostu przekonwertować json na PriceTag przez odlewanie typu, ale wtedy nie będzie to prawdziwy obiekt PriceTag.

Sposób, w jaki zostały rozwiązane to:

export class Serializable { 
    constructor(json?: any) { 
    if (json) { 
     Object.assign(this, json); 
    } 
    } 
} 

A potem serializable klasa:

export class PriceTag extends Serializable {} 

Następnie czynność GetPriceTags musi być zmienione na:

getPriceTags(): Observable<PriceTag> { 

    // Set the request headers 
    const headers = new Headers({ 'Content-Type': 'application/json' }); 

    // Returns the request observable 
    return this.http.post(Constants.WEBSERVICE_ADDRESS + "/priceTag", null, {headers: headers}) 
    .map(res => new PriceTag(res.json())); 

}