Popover enableBackdropDismiss: false is not working

Ionic Framework ionic-v3
1

Hi,

I’m using tabs with more tab option. From more tab, I want to open basic Ionic 2 popover.

My first problem, using enableBackdropDismiss: false option is not working. I can still dismiss popover by clicking on backdrop.
Secondly, instead of showing popover in the bottom right corner, above from tab, it’s showing in the center of page.

Am I doing something wrong in code?

@Component({
templateUrl: ‘tabs.html’
})
export class TabsPage {

tab1Root = HomePage;
tab2Root = AboutPage;
tab3Root = ContactPage;

constructor(public popoverCtrl: PopoverController) {

}

showPopOver(event) {

let popover = this.popoverCtrl.create(PopoverPage, {
  enableBackdropDismiss: false
});

popover.present({
  ev: event
});

}
}

html

ion-tab tabTitle=“More” tabIcon=“more” (ionSelect)=“showPopOver($event)”>

2

To your first issue: the PopoverController docs define the create method as follows:

create(component, data, opts)

so you might have to insert your options as the third parameter:

let popover = this.popoverCtrl.create(PopoverPage, {}, {
  enableBackdropDismiss: false
});
2 Likes
3

tq…this is working fine