Ионный 2 Угловой 2 получение данных REST JSON

Question

Я, вероятно, просто делаю глупую ошибку где-то, но я ее больше не вижу.

У меня очень простое приложение Ionic 2 Angular 2. Пожалуйста, не беспокойтесь об архитектуре, я просто пытаюсь заставить ее работать в первую очередь. Я пытаюсь заполнить свой массив 'configureModules' объектами модуля, которые я получаю от службы REST JSON. Я создал кнопку, которая регистрирует массив на консоли, поэтому я могу видеть, что такое значение массива, но всегда не определено. Что я делаю не так?

export class Module { 
    type: string; 
    physicalLocationName: string; 
} 

и мой основной класс:

import { Component, OnInit } from '@angular/core'; 
import { Module } from './module'; 
import { HttpModule, Http, Response} from '@angular/http'; 
import { Observable } from 'rxjs'; 
import 'rxjs/add/operator/toPromise'; 

import { NavController } from 'ionic-angular'; 

@Component({ 
    selector: 'page-home', 
    templateUrl: 'home.html' 
}) 
export class HomePage implements OnInit{ 
    configuredModules: Module[]; 
    http: Http; 

    constructor(public navCtrl: NavController,private _http: Http) { 
    this.http = _http; 
    } 

    getConfiguredModules(){ 
     this.getModules() 
     .then(modules => this.configuredModules = modules); 
     console.log('finished configuredModules'); 
    } 

    getModules(): Promise<Module[]> { 
    return  this.http.get('http://localhost:8080/rest/modules/configuredModules') 
      .toPromise() 
      .then(response => response.json().data as Module[]) 
      ; 
    } 

    ngOnInit() { 
     this.getConfiguredModules(); 
    } 

    buttonClicked(){ 
    console.log('button clicked'); 
    console.log(this.configuredModules.values); 
    } 
} 

Если я смотрю в моей сети вкладки Chrome, я вижу следующее приходить в (под ответ):

{"modules":[{"type":"myTestType","physicalLocationName":"myTestPhysicalLocation"}]} 

Я знаете, что данные поступают, но он не заполняет мой массив. Какие-либо предложения? Я думаю, что мой код выглядит идентично к Героям учебника угловых 2: https://angular.io/docs/ts/latest/tutorial/toh-pt6.html

Answer 1

Вашей ошибка в этой функции:

getModules(): Promise<Module[]> { 
    return this.http.get('http://localhost:8080/rest/modules/configuredModules') 
    .toPromise() 
    .then(response => response.json().data as Module[]); 
} 

Удалите .data после функции json() и добавить .modules вместо этого. Это то, что приходит из вашего API, поэтому он должен выглядеть следующим образом:

getModules(): Promise<Module[]> { 
    return this.http.get('http://localhost:8080/rest/modules/configuredModules') 
      .toPromise() 
      .then(response => response.json().modules as Module[]); 
    } 

Затем на кнопке щелкнул функцию, удалите values, так это выглядит следующим образом:

buttonClicked(){ 
    console.log('button clicked'); 
    console.log(this.configuredModules); 
}