I’m trying to get the data that I pass when showing my modal; I can’t find how I can retrieve the data inside the modal. ModalController doesn’t have any useful options. async openModel() { const modal = await this.modalCtrl.create({ component: ManagePage, componentProps: { test: 5 } }); await modal.present(); } How can I retrieve “5” in the modal?

Like this: // Show modal const modal = await this.modalCtrl.create({ component: ModalPage }); modal.present(); // Get returned data const { data } = await modal.onWillDismiss();

didn’t tried, but, maybe, still with NavParams like in v3? probably not but I would try that first

Thanks man, it was indeed NavParams. I don’t know why I didn’t test it, maybe because it wasn’t in the documents? Anyway, problem solved!

Awesome, thx for the feedback. I don’t have tried the Modal yet, one thing less I will not have to search :wink:

How to catch hold of the onDidDismiss() -> like ionic 3??

[image] [Ionic-v4] Modal Parameters Ionic Framework Did you try NavParams in your modal to get the params? https://forum.ionicframework.com/t/ionic-4-get-data-in-modal-passed-with-componentprops/ As far I understand it works like following To pass parameters to the modal, use componentProps const modal: HTMLIonModalElement = this.modalController.create({ component: MyModal, componentProps: { something: 'value', other: {couldAlsoBeAnObject: true} } }); To get the values in your modal const something: string = this.navP…

But I am getting an error for using navaparams in home page. At first I tried to pass the params via router from app.components.ts file loadMagazine(){ this.router.navigate([’’, {filterType: ‘magazine’}]); } for the above I am getting an error saying ERROR Error: Root segment cannot have matrix parameters and on Home page ERROR Error: Uncaught (in promise): Error: StaticInjectorError(AppModule)[HomePage -> NavParams]: ** ** StaticInjectorError(Platform: core)[HomePage -> NavParams]: ** ** NullInjectorError: No provider for NavParams!

what would be the non-angular way? Just out of curiosity Getting navParams…

NavParams are no longer supported in Ionic v4 - you will get a static injector error. In your receiving Component, you need to use the @Input annotation on the variable name, as described in this post: https://stackoverflow.com/questions/52012447/ionic-4-how-to-retrieve-data-passed-to-a-modal, and then you’ll be able to access the passed in value in your Component’s ngOnInit method.

[image] Overton: NavParams are no longer supported in Ionic v4 - you will get a static injector error. Not agree with that, I use beta.7 and NavParams and don’t get any injector error Furthermore they are supported, see their implementation https://github.com/ionic-team/ionic/blob/4fcab896511672795c0bdf0ecf1b5561f67b3b45/angular/src/directives/navigation/nav-params.ts [image] Overton: In your receiving Component, you need to use the @Input annotation on the variable name, as described in this post: https://stackoverflow.com/questions/52012447/ionic-4-how-to-retrieve-data-passed-to-a-modal , and then you’ll be able to access the passed in value in your Component’s ngOnInit method. agree with the answer of @aaronksaunders to your same post there [Ionic-v4] Modal Parameters - #6 by aaronksaunders @Input are not necessary in that case

I stand corrected! It looks like both are valid ways to retrieve parameters. (Odd that there’s no documentation page for it, however, or for NavController.) The static injector error I was getting was a red herring - I believe related to issues setting up the owning module. Note that if you use NavParams, the values will be available in the constructor, versus if you use the @Input attribute, you’ll have to wait for ngAfterViewInit().

[Ionic 4] Get data in modal passed with componentProps

Ionic Framework

reedrichards August 14, 2018, 11:40am 6

Topic		Replies	Views
[Ionic-v4] Modal Parameters Ionic Framework	10	22699	March 22, 2019
How i use modalController with onDidDismiss on ionic 4? Ionic Framework	2	8884	August 27, 2018
How to get parameters in modal.page.ts in ionic-v4 Ionic Framework	11	9243	April 2, 2019
Pass parameters to a Modal in Ionic 4 Ionic Framework	1	15384	August 17, 2018
How to create a modal with parameters? ionic-v3	5	17315	July 4, 2016

[Ionic 4] Get data in modal passed with componentProps

Related topics