CODEWITHSUNDEEP
angularionic-frameworkionic4
nachshon f
nachshon f

Reputation: 3680

Ionic 4 popover appearing off screen

I have an Ionic 4 Popover on a button on the bottom of the screen. When I click the button to open the popover, it appears off-screen underneath...

.html

<div class="TabBarItem" (click)="popover($event)">
  <label>Tab Item</label>
</div>

.ts

   function popover(ev) {

    this.popoverController
                .create({
                  component: PopoverComponent,
                  event: ev,
                  translucent: true,
                })
                .then(el => {
                  el.present();
                });
    }

Result...

enter image description here

Is there a way to fix this, or manually reposition it?

Upvotes: 3

Views: 2359

Answers (1)

nachshon f
nachshon f

Reputation: 3680

Turns out all I had to do is add <ion-content> to my popover component. This fixed the issue.

Upvotes: 6

Related Questions