How to return value from modal

Ionic Framework ionic-v3
1

Hi,

is there a way to return a value from a modal?

I have a modal with search component implemented selected value should be returned and modal closes, i have done the closing part but no idea how to get that value.

Did anyone done this?

Thanks

2

If you save that value in the $scope it should stick even with the modal closed. Did you try?

3

can we use $scope in angular 2?

4

My bad, I didn’t notice you were talking about angular2. No idea then :confused:

5

This might help you.

6

Thanks Richard, i will definitely going to look into this.

7

You could always use a shared service to store data in, the solution Richard mentioned is probably better for most cases.

8

This will be added in the alpha.38 release which I plan on doing later today, you will be able to pass data back in the close function:

https://github.com/driftyco/ionic2/issues/668

In the close function of the modal page:

  closeModal() {
    this.close({
      adel: 'hello',
      lionel: 'hello'
    });
  }

In the function opening the modal from the main page:

  openToolbarModal() {
    this.modal.open(ToolbarModal).then(modalRef => {
      // modal has finished opening
      // modalRef is a reference to the modal instance
      modalRef.onClose = (modalData) => {
        // somehow modalRef.close(modalData) was called w/ modalData
        console.log('modalRef.onClose', modalData)
      }
    });
  }

https://github.com/driftyco/ionic2/blob/master/ionic/components/modal/test/basic/index.ts

When this is released I’ll be adding an example to the conference app, as well.

1 Like
9

Up! :slight_smile:
At now, I can return data throw dismiss method. But, I don’t understand how I can catch this data?

PS: Please. fix docs :worried:

10

Once you’ve created your modal, add an onDismiss listener before presenting it on the nav, i.e:

myModal.onDismiss(data => {
    console.log(data);
});
5 Likes
11

Please note that the method was renamed to onDidDismiss:

let profileModal = this.modalCtrl.create(Profile, { userId: 8675309 });
profileModal.onDidDismiss(data => {
  console.log(data);
});
profileModal.present();

( https://github.com/driftyco/ionic/blob/3c493652b2991240b6cb6fc49a9792b8be306df7/src/components/modal/modal.ts#L153 )

3 Likes