Неспособность разобрать ответ json в объект с Angular2

Question

Я стараюсь следовать этим направлениям: https://angular.io/docs/ts/latest/guide/server-communication.html и получить список объектов с сервера в виде объекта (не json).

У меня есть класс модели (упрощенный сейчас):

export class Goal { 
    id: number; 
    title: string; 
} 

И я пытаюсь получить список этих с сервера через класс обслуживания следующим образом:

export class GoalsService { 

    constructor(public authHttp:AuthHttp) { 
    } 

    getGoals() { 
    let headers = new Headers({ 'Content-Type': 'application/json' }); 
    let options = new RequestOptions({ headers: headers }); 

    return this.authHttp.get('<%= BACKEND_BASE_URL %>' + '/rrm/api/v1/goals', options) 
     .map(res => { 
      <Goal[]> res.json() 
     } 
    ) 
     .do(data => console.log(data)) 
     .catch(this.handleError); 
    } 
... 

а также клиент, использующий класс обслуживания:

loadGoals() { 
    this.goalsService.getGoals().subscribe(
     goals => this.goals = goals 
    ); 
    } 

Запрос проходит должным образом, и я возвращаюсь:

[{"id":1,"title":"target"}] 

Однако, в клиенте, внутри subscribe, goals переменная всегда 'не определено'.

Я попытался ее отладки, это то, что я получаю:

Который говорит мне, что JSON получил и разобраны правильно, но приведения его в целевой объект не работает (если я не до конца не получение механизм).

Что я делаю неправильно?

Спасибо,

, обратите внимание: authHttp сервис, который я использую этот парень: https://auth0.com/blog/2015/11/10/introducing-angular2-jwt-a-library-for-angular2-authentication/. И он работает во всех других местах, как ожидалось. Поэтому я сомневаюсь, что это peoblem.

Answer 1

Как вы используете map Функция стрелки, вы должны return отображаемый результат.

return this.authHttp.get('<%= BACKEND_BASE_URL %>' + '/rrm/api/v1/goals', options) 
    .map(res => { 
     return <Goal[]> res.json(); //return mapped object from here 
    } 
) 

ИЛИ

return this.authHttp.get('<%= BACKEND_BASE_URL %>' + '/rrm/api/v1/goals', options) 
    .map(res => <Goal[]> res.json()) //or simply do map object directly