Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to pass data in ionic2

Tags:

angular

ionic2

I get data through http. I want to pass data to PlacesListPage. There are "id, name, category, ..." in my data. I want to use theese in PlacesListPage like this: {{xxx.id}}, {{xxx.name}}... Please help me... xxx - for example)

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;
        });

}
like image 332
Mireli Eyyubzade Avatar asked Jan 07 '23 05:01

Mireli Eyyubzade


2 Answers

You can use this approach as well:

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

and than

constructor(private navParams: NavParams) {
        this.something = this.navParams.get("something");
 }
like image 144
Denko Mancheski Avatar answered Jan 14 '23 11:01

Denko Mancheski


Use the NavController to pass data to the Page as you navigate to it:

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

Then use NavParams in your PlacesListPage to access the data:

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

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

like image 28
Pat Murray Avatar answered Jan 14 '23 11:01

Pat Murray