Ionic Modal On Dismiss Bug

Question

I was building a small app and I found this "bug" because I don't know if maybe it's something that has happened to more people but I think it's interesting to mention here. So the problem is that I've made a modal with a simple login form. When you submit the data from the form it enters the method login() as you can see in the code example below. The problem is that when the login method is called and all is done I dismiss the modal passing data in order to inform the other page that something has changed. But curiously this modal.onDismiss() passing data is not fired on the page when I'm on the web. It only fires when is a mobile and the modal is full screen. Does somebody know why this happens and how to solve it?

The method that opens the modal:

 async showLoginModal() { const modal = await this.modalController.create({ component: LoginModalComponent }); await modal.present(); this.menuController.close(); modal.onDidDismiss().then((data) => { console.log(data) Storage.get({ key: 'user' }).then( response => { let user: User = JSON.parse(response.value); console.log(user); if(user.email.= null){ this;logged = true; } }); }) }

login method fired on submit inside the modal.

 async login(){ let user: User = { email: this.credentials.controls['email'].value } await Storage.set({ key: 'user', value: JSON.stringify(user) }); await this.modalController.dismiss(user); }

And here I leave a video to show you in a more visual way: Click me

Answer 1

Try to change your code this way

async showLoginModal() { const modal = await this.modalController.create({ component: LoginModalComponent }); modal.onDidDismiss().then((data) => { console.log(data) Storage.get({ key: 'user' }).then( response => { let user: User = JSON.parse(response.value); console.log(user); if(user.email.= null){ this;logged = true; } }); }). await modal;present(). this.menuController;close() }