Angular2 синтаксический анализ от JSON к объекту

Question

Я пытаюсь найти лучший способ отбросить мой объект json к объекту Postscript. У меня есть служба получения http, которая возвращает список пользователей. Мои текущие версии работы, я добавил от функции JSON для всех моих классов моделей, чтобы сделать отображение работы:

export class User { 

    constructor(
     public pk: number, 
     public username: string, 
     public first_name: string, 
     public last_name: string, 
     public email: string, 
     public profile: UserProfile,) { 
    } 

    static fromJSON(json: any): User { 
     let user = Object.create(User.prototype); 
     Object.assign(user, json); 
     user.profile = UserProfile.fromJSON(json.profile); 
     return user; 
    } 
} 

Это хорошо работает. Но есть кое-что, что я не получаю в угловом 2 документах. В учебнике героев, JSON автоматически отливают на объект таким образом:

getHeroes(): Observable<Hero[]> { 
    return this.http.get(this.heroesUrl) 
        .map(this.extractData) 
        .catch(this.handleError); 
    } 
    private extractData(res: Response) { 
    let body = res.json(); 
    return body.data || { }; 
    } 

Я не могу получить этот метод, чтобы работать на моем случае, я сказал, что body.data не определено. Действительно ли этот метод работает?

EDIT:

Моя служба HTTP не возвращает массив пользователей. Он возвращает страницу, содержащую массив пользователей в свойстве «results».

{ 
    "count": 2, 
    "next": null, 
    "previous": null, 
    "results": [ 
    { 
     "pk": 48, 
     "first_name": "Jon", 
     "last_name": "Does", 
     "profile": { 
     "pk": 46, 
     "gender": "U" 
     } 
    }, 
    { 
     "pk": 47, 
     "first_name": "Pablo", 
     "last_name": "Escobar", 
     "profile": { 
     "pk": 45, 
     "gender": "M" 
     } 
    } 
    ] 
} 

Мой код услуги:

private extractData(res: Response) { 
    let body = res.json().results; 
    return body || {}; //<--- not wrapped with data 
    } 

    search(authUser: AuthUser, terms: string): Observable<User[]> { 
    let headers = new Headers({ 
     'Content-Type': 'application/json', 
     'X-CSRFToken': this.cookiesService.csrftoken, 
     'Authorization': `Token ${authUser.token}` 
    }); 
    let options = new RequestOptions({ headers: headers }); 
    return this.http.get(environment.server_url + 'user/?search=' + terms, options) 
     .map(this.extractData); 
    // .map((response: Response) => response.json()); 
    } 

Мой код компонент поиска:

onSearch(terms: string) {  
    this.searchService.search(this.user, terms).subscribe(
     response => {  
      console.log(response); // Return array of object instead of array of user 
     }, 
     error => { 
      console.log(JSON.stringify(error)); 
     }, 
    () => { } 
    ); 
} 

EDIT 2:

Для того, чтобы этот случай проще, я написал простой код:

test(){ 
    let json_text=` [ 
     { 
     "id": 1, 
     "text": "Jon Doe" 
     }, 
     { 
     "id": 1, 
     "text": "Pablo Escobar" 
     } 
    ]`; 

    console.log(<MyObject[]>JSON.parse(json_text)); // Array of objects 
    console.log(MyObject.fromJSON(JSON.parse(json_text))); // Array of 'MyObject' 
    } 



export class MyObject{ 
    id: number; 
    text: string; 

    static fromJSON(json: any): MyObject { 
     let object = Object.create(MyObject.prototype); 
     Object.assign(object, json); 
     return object; 
    } 
} 

• console.log(<MyObject[]>JSON.parse(json_text)) возвращает список объектов
• console.log(MyObject.fromJSON(JSON.parse(json_text))) возвращает список MyObject

Answer 1

Это потому, что в угловых учебнике JSON в собственности данных.

Как указано в учебнике

не сделать никаких предположений о сервере API. Не все серверы возвращают объект с свойством data.

Если вы не оборачивать вашу JSON с любой собственности вы можете просто использовать

private extractData(res: Response) { 
    let body = res.json(); 
    return body || { }; //<--- not wrapped with data 
} 

Update:

код компонента

onSearch(terms: string) {  
    this.searchService.search(this.user, terms).subscribe(
     (response: SearchResponse) => { // <--- cast here 
      console.log(response); 
     }, 
     error => { 
      console.log(JSON.stringify(error)); 
     }, 
    () => { } 
    ); 
}