Dismissing modal with navigation controller in it

Ionic Framework ionic-v3
1

Hello, how can I dismiss a modal that has pushed some pages on it?

I mean Home presents A as modal, A pushes B to navcontroller.

I tried passing viewcontroller of A to B, and then calling .dismiss on that but magically for me it dismisses A but B is still there.

2

You can get the root nav and call dismiss

import {Component} from '@angular/core';
import {NavController, App} from 'ionic-angular';
@Component({
  templateUrl: 'build/pages/home/home.html'
})
export class HomePage {
  constructor(
    public navCtrl: NavController,
    public app: App
  ) {

  }
  dismiss() {
    this.app.getRootNav().dismiss()
  }

}

May not be exact, but should still work.

3

Hi Mike,

Sorry for refloating an old thread, it’s the only info I found about this.

I have exactly the same use case as @EralpBay, closing a modal from its child navigation. TypeScript complains this.appCtrl.getRootNav() doesn’t have the dismiss() function.

Can you share an updated example for Ionic 3.x?

Thanks a lot in advance!
Rodrigo

4

The following is working for me (ionic v.3.8.0):

import { Component } from '@angular/core';
import { NavController, NavParams, App } from 'ionic-angular';

@Component({
  templateUrl: 'build/pages/home/home.html',
})
export class HomePage {

  constructor(public navCtrl: NavController, public navParams: NavParams, public app: App) {

  }

  dismiss() {
    this.navCtrl.pop()
  }

}
5

In case you’re still trying to figure this out or for the next person, my solution was using this.app.navPop() from the modal.

1 Like
6

Thanks, this worked for me