Odpowiedź Angular 2 map http na instancję klasy

Question

Zastanawiam się, jaki jest najlepszy sposób odwzorowania odpowiedzi http z żądania pobrania na klasę zamiast podstawowego obiektu JavaScript.

W mojej obecnej próbie łatwo mogę uzyskać new ClassName(data), ale może być też podany niejasny kątowy i całkowicie niesamowity sposób na zrobienie tego, czego nie wiem.

Oto mój bieżący kod:

getPost(id:number){ 
    return this._http.get(this._postsUrl+'/'+id) 
       .map(res => new Post(res.json().data)) 
       .do(data => console.log(data)) 
       .catch(this.handleError); 
} 

muszę Post być klasą, a nie tylko interfejs, bo mam metod wewnątrz.

I po HeroTutorial i http „podręcznik programisty” wzdłuż i w ich getHeroes metody robią:

getHeroes() { 
return this.http.get(this._heroesUrl) 
       .map(res => <Hero[]> res.json().data) 
       .catch(this.handleError); 
} 

jakoś Oczekuje się <Hero[]> udział nie tylko to: Weź klasę bohatera i utworzyć nowe instancje z tego, ale moje testy pokazują, że tak nie jest, to jest po prostu dla Maszynistki wiedzieć, czego się spodziewać.

Wszelkie pomysły? Dzięki!

Answer 1

myślę, że można użyć metody map obiektów JavaScriptu:

getHeroes() { 
    return this.http.get(this._heroesUrl) 
      .map(res => { 
       return res.json().data.map((elt) => { 
       // Use elt to create an instance of Hero 
       return new Hero(...); 
       }); 
      }) 
      .catch(this.handleError); 
} 

Answer 2

Ustawiając prototyp na obiekt zwracane udało mi się dostać wystąpienie mojej klasie.

getHero() { 
     return this.http.get(this._heroUrl) 
      .map(response => { 
        let res = <Hero> response.json(); 
        Object.setPrototypeOf(res, Hero.prototype); 
        return res; 
        }) 
      .catch(this.handleError); 
} 

Moja klasa była bardzo prosta z konstruktorem bez parametrów, więc to działało dla mnie. Dla bardziej złożonych klas nie wiem, czy to by działało.

Uwaga: powyższy kod dotyczy getHero() not getHeroes(). Zakładam, że mógłbym zrobić to samo z listą, ustawiając prototyp na każdym elemencie w tablicy, ale nie próbowałem/potwierdziłem tego.

referencyjny: Mam pomysł na to z this post przez BMiner

Answer 3

Dobra praktyka jest, aby spożywać dane z odpowiedzi GET użyciu

Observable<Model> 

(odnośnie do Kątowymi dokumentacji https://angular.io/guide/http) Więc ...

// import

import {HttpClient} from "@angular/common/http"; 

// w liście parametrów konstruktora

private http: HttpClient 

// obsługa metoda

getHeroes(): Observable<Hero[]> {return this.http.get<Hero[]>({url}, {options});} 

Nie musisz robić nic więcej. Uważam to podejście za najbardziej przyjazne.