使用angular2/typescript獲取數據

我有一個angular2和typescript的問題。我嘗試抓取數據jsonp，但返回函數是可觀察的，我需要de對象結果。我需要幫助。使用angular2/typescript獲取數據

Accounts.ts

import { Component} from '@angular/core'; 
import { NavController, NavParams } from 'ionic-angular'; 
import {AccountService} from '../../providers/account-service'; 
import { Observable } from 'rxjs/Rx'; 


@Component({ 
    selector: 'page-account', 
    templateUrl: 'account.html', 
    providers: [AccountService] 
}) 
export class AccountPage { 

    data: any; 
    listAccounts: any; 
    accounts: any; 


    constructor(public navCtrl: NavController, public navParams: NavParams, private AccountService: AccountService) { 
     this.accounts = this.getAccountsResult();  

    } 

    getAccountsResult() { 
     return this.AccountService.retrieveAccounts(); 
    } 

    getAccountsResultDebug() { 
     console.log(this.AccountService.retrieveAccounts()); 
    } 

}

賬戶，service.ts

import { Injectable } from '@angular/core'; 
import { Headers, Http, RequestOptions, Jsonp } from '@angular/http'; 
import 'rxjs/Rx'; 


/* 
    Generated class for the AccountService provider. 

    See https://angular.io/docs/ts/latest/guide/dependency-injection.html 
    for more info on providers and Angular 2 DI. 
*/ 
@Injectable() 
export class AccountService { 

    /** 
    * Variaveis globais 
    **/ 

    data: Array<AccountService>; 
    token: string; 
    url: string; 
    param: string; 
    result: any; 


    constructor(private http: Http, private jsonp: Jsonp) { 
     this.http = http; 
     this.jsonp = jsonp; 
     this.token = 'tokenofapp' 
     this.url = 'urlofapp' 

    } 


    /** 
    * PROGRAMADOR:  Débora Gonçalves 
    * DATA:   23/01/2017 
    * OBJETIVO:  Recuperando dados da API accounts 
    **/ 

    retrieveAccounts() { 

     // variavel para enviar os headers 
     let headers = new Headers(); 

     //definindo valores no array headers 
     headers.append('x-access-key', this.token); 
     headers.append('Content-Type', 'application/jsonp'); 

     // definindo o requestoptions com os parametros do headers 
     let options = new RequestOptions({ 

      headers: headers 

     }); 

     //executando requisição da url 
     //return this.jsonp.get(this.url, options).map(res => res.json()); 
     // .subscribe(
     // data => this.result = [data] 
     //); 


     return this.jsonp.get(this.url, options).map(res => res.json()); 

    } 

}

accountpage

<ion-header> 
    <ion-navbar> 
    <button ion-button menuToggle> 
     <ion-icon name="menu"></ion-icon> 
    </button> 
    <ion-title>Contas</ion-title> 
    </ion-navbar> 
</ion-header> 

<ion-content> 
    <ion-list> 
     <button ion-item outline *ngFor="let i of accounts.result" (click)="openPage($event, 1, DetailsAccountPage)"> 
      <p>a</p>{{i}} 
      <p *ngFor="let f of i" strong>Nome do fulano {{f}}</p> 
     </button> 
     <button ion-item outline> 

      <p strong>Nome do fulano</p> 
      <div class="item-note" item-right> 

      </div> 
     </button> 

     <button ion-item outline (click)="getAccountsResultDebug()"> 

      <p strong>Nome do fulano</p> 
      <div class="item-note" item-right> 

      </div> 
     </button> 
    </ion-list> 
</ion-content>

來源

2017-01-25 Débora Gonçalves