2016-04-21 83 views
4

我通过http获取数据。我想将数据传递给PlacesListPage。在我的数据中有“ID,名称,类别......”。我想在PlacesListPage使用theese这样的:{{} xxx.id},{{xxx.name}} ...请帮我... XXX - 例如)如何通过ionic2传递数据

import {Page, NavController, NavParams} from 'ionic-angular'; 
import {Http} from 'angular2/http'; 
import 'rxjs/Rx'; 
import {PlacesListPage} from '../places-list/places-list'; 
/*enter code here 
    Generated class for the PlacesPage page. 

    See http://ionicframework.com/docs/v2/components/#navigation for more info on 
    Ionic pages and navigation. 
*/ 
@Page({ 
    templateUrl: 'build/pages/places/places.html', 
}) 
export class PlacesPage { 
    static get parameters() { 
    return [[NavController], [Http], [NavParams]]; 
    } 


    constructor(nav, http, navParams) { 
    this.nav = nav; 
    this.http = http.get('https://api.myjson.com/bins/2ud24').map(res => res.json()).subscribe(
     (data) => { 
      this.data = data; 
     }); 

} 
+0

什么是'PlacesListPage'?这是一项服务吗?它是一个自定义元素吗?你在'places.html'里面使用它吗? – kabaehr

+0

是的。这是自定义页面。我进口顶部。第4行 –

+0

你能提供它的代码吗? – kabaehr

回答

2

使用NavController将数据传递到页面,你找到它:

this.nav.push(PlacesListPage, { 
    xxx: this.data 
}); 

然后使用NavParams在PlacesListPage访问数据:

constructor(navParams) { 
    this.xxx = navParams.data.xxx; 
} 

http://ionicframework.com/docs/v2/api/components/nav/NavParams/

+0

但我的数据是一个对象。我无法将对象数据传递到其他页面 –

+0

您应该可以,您是否收到错误? –

+0

是的。当我点击进入另一个页面的数据。应用程序不起作用,并显示我在控制台日志上的错误 –

7

您可以使用此方法还有:

let something = { test: 1 }; 
this.nav.push(existingPaymentModal, {something}); 

,比

constructor(private navParams: NavParams) { 
     this.something = this.navParams.get("something"); 
} 
+0

谢谢。我解决了我的问题。 –

+0

如果它帮助你,你可以接受:) –