How to pass parameters in pop method of ionic2

Question

I tried passing parameters in push method of ionic2. like this

this.nav.push(SecondPage, {
    thing1: data1,
    thing2: data2
});

but is ther

Answer 1

For sent data with pop you can use getPrevious() method.

When leaving from current page get previous page and send data

ionViewWillLeave() {
    this.navCtrl.getPrevious().data.formData = {credentials: {...}};
}

In next page get data from navParams

ionViewWillEnter() {
    if (this.navParams.get('formData')) {
      // do something
    }
  }

Answer 2

pass in a callback when transitioning by aaronksaunders in this forum

https://forum.ionicframework.com/t/solved-ionic2-navcontroller-pop-with-params/58104/4

Going to try it out.

Answer 3

Use popTo() instead of pop()

popTo() has params? parameter where you can pass in your paramaters like so:

    this.nav.popTo(SecondPage, {
    thing1: data1,
    thing2: data2
});

Answer 4

If you are using ionic-angular application, you can use ionic-angular Events

page1.ts

import { Events,NavController } from 'ionic-angular';

export class page1 {

    constructor(private events: Events,
                private nvCtrl: NavController
               ) {}

     goToPage2() {
         this.navCtrl.pop();
         this.event.publish('your-event');
 }

}

page2.ts

import { Events} from 'ionic-angular';

export class page1 {

    constructor(private events: Events,
                private nvCtrl: NavController
               ) {}

     ionViewDidLoad() {
        this.events.subscribe('your-event');
  }

}

Answer 5

This is how I achieved it in ionic-3 and find it easier.

Page from where we pop()

 this.navCtrl.getPrevious().data.thing1 =data1;
 this.navCtrl.getPrevious().data.thing2 =data2;
 this.navCtrl.pop();

Page after pop():

public ionViewWillEnter() {
     this.thing1 = this.navParams.get('thing1')|| null;
     this.thing2 = this.navParams.get('thing2')|| null;
} 

Answer 6

I suggest you use Events. All you have to do is to subscribe to an event on the parent page and then publish the event on the child passing the data you want:

// taken from the docs
import { Events } from 'ionic-angular';

constructor(public events: Events) {}

// first page (publish an event when a user is created)
function createUser(user) {
  console.log('User created!')
  events.publish('user:created', user);
}

// second page (listen for the user created event)
events.subscribe('user:created', (userEventData) => {
  // userEventData is an array of parameters, so grab our first and only arg
  console.log('Welcome', userEventData[0]);
});