Popover backdrop click event not propagating

Ionic Framework
1

I am trying to add a listener to the backdrop event click on a popover but the event is not being propagated so I am unable to listen to it.

How can I fix this?

PD: Another workaround for my case is to be able to cancel de popover dismiss on backdrop click. Is this posible?

2

Another workaround for my case is to be able to cancel de popover dismiss on backdrop click. Is this posible?

Sure, you can achieve this by setting backdropDismiss​ to false

  • For inline popover:
<ion-popover [backdropDismiss]="false">
  <!-- ... -->
</ion-popover>
  • For controller popover
import { Component, ViewChild } from '@angular/core';
import { PopoverController } from '@ionic/angular';
import { PopoverComponent } from './popover.component';

@Component({
  selector: 'app-example',
  templateUrl: 'example.component.html',
})
export class ExampleComponent {
  constructor(public popoverController: PopoverController) {}

  async presentPopover() {
    const popover = await this.popoverController.create({
      component: PopoverComponent,
      backdropDismiss: false, // 👈 add this
    });

    await popover.present();
  }
}

You can refer to the related documentation here:

3

Thanks for the response.

I want to be able to, when the user clicks on the backdrop, allow or not to dismiss the popover. I can use the backdropDismiss and change it to allow or not but I need to know when te user clicks on the backdrop. And the problem is that the click event is not being propagated.