Ionic 4 modal backdrop is over modal content


#1

I’m trying to add a modal to my application, but when I open the modal the backdrop goes on top of the modal content. How can I fix this?

Here is the code I have to open the modal

async displayModal() {
  const modal = await this.modalController.create({
     component: NewGalleryFormComponent,
     componentProps: {}
  });

   return await modal.present();
}

My NewGalleryFormComponent does not have any code yet, just the default text. I generated using the ionic cli.


#2

try this

async displayModal(){
let modal =await this. modalController.create('NewGalleryFormComponent', {},{
      showBackdrop: false,
       cssClass:'myClass'
    });
      return await modal.present();
}

can put “myclass” to give a style to your modal


#3

If I set the backdrop to false it works fine.


#4

I actually fixed with the original code I had. The issue was my template was missing the <ion-content padding> tags.