Close Modal - Ionic 4 using Angular

Question

I had created a page reservation.page.ts in which i want to make a modal form using ionic 4. i'm using ionic modal controller for that. the example code which i did is

async closeModal() {
    await this.viewCtrl.dismiss();
}

still my modal is didn't work.

it gives an error like

core.js:9110 ERROR Error: Uncaught (in promise): overlay does not exist
    at resolvePromise (VM11170 polyfills.js:3803)
    at VM11170 polyfills.js:3713
    at rejected (VM11177 vendor.js:129666)
    at ZoneDelegate.invoke (VM11170 polyfills.js:3365)
    at Object.onInvoke (VM11177 vendor.js:71868)
    at ZoneDelegate.invoke (VM11170 polyfills.js:3364)
    at Zone.run (VM11170 polyfills.js:3130)
    at VM11170 polyfills.js:3861
    at ZoneDelegate.invokeTask (VM11170 polyfills.js:3397)
    at Object.onInvokeTask (VM11177 vendor.js:71849)

so please help me out.

Answer 1

Use ModalController to dismiss the modal instead of the old ViewController implementation.

Open modal

async openModal() {
  const modal = await this.modalController.create({
    component: Page
  });

  return await modal.present();
}

Close modal on Page

close() {
  this.modalController.dismiss();
}

Answer 2

I was able to fix this issue by declaring the variable modal and then using it to close the modal:

export class BlaBlaPage implements OnInit {

modal:any;

close() {
  this.modal.dismiss();
}