2016-02-23 2 views
11

Мне интересно, как лучше всего отобразить ответ HTTP от запроса на получение класса вместо основного объекта Javascript.Угловая карта 2 ответа на экземпляр класса

В моей текущей попытке я просто делаю new ClassName(data), но там может быть неясное Угловое указание и полностью устрашающий способ сделать это, что я не знаю.

Вот мой текущий код:

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); 
} 

мне нужно сообщение, чтобы быть классом, а не просто интерфейс, потому что у меня есть методы внутри.

Я следовал HeroTutorial и HTTP «руководство разработчика» вместе и в их методе getHeroes они делают:

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

я как-то ожидал, что <Hero[]> часть сделать именно это: Возьмите класс героя и создать новые экземпляры из этого, но мои тесты показывают, что это не так, это в значительной степени просто для машинописного машиностроения, чтобы знать, чего ожидать.

Любые идеи? Благодаря!

+4

Это не связано с Angular или Http, но только с TypeScript => как десериализовать JSON для конкретного экземпляра класса. –

+2

'new ClassName (data)' является полностью допустимым, вы можете связывать операторы и делать сопоставление, фильтровать, уменьшать ... Наблюдаемые не волнуют, что они обертывают (; – Sasxa

+0

@ GünterZöchbauer Похоже, вы правы, быстрый поиск тех слова действительно вернули много результатов. Ни один из них на самом деле не то, что я хотел услышать, но я буду управлять чем-то, зная, что нет хорошего способа это сделать. – Growiel

ответ

15

Я думаю, что вы могли бы использовать метод map объектов JavaScript:

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); 
} 
+1

Отлично, это работает как шарм! как решение. Спасибо, Тьерри! – Juergen

2

Установив прототип на объекте, вернулся, я был в состоянии получить экземпляр моего класса.

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

Мой класс был очень простым с безпараметрическим конструктором, поэтому это сработало для меня. Для более сложных классов я не знаю, будет ли это работать.

Примечание: приведенный выше код предназначен для getHero() не getHeroes(). Я бы предположил, что я мог бы сделать то же самое со списком, установив прототип на каждый элемент массива, но я не пробовал/не подтвердил это.

Ссылки: У меня есть идея для этого из this post по BMiner

1

Хорошей практики использовать данные из ответа GET с использованием

Observable<Model> 

(в отношении к Угловым документациям https://angular.io/guide/http) Итак ...

// импорт

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

// в списке параметров конструктора

private http: HttpClient 

// Сервис метод

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

Вам не нужно делать ничего больше. Я считаю этот подход наиболее дружелюбным.

Смежные вопросы