Ionic-framework: bug: ion-popover doesn't work in ion-content

[calendee]

Type: bug

Platform: all

When using ion-popover in apps with ion-content, the popover backdrop loads but the popover is not visible. Changing the popover opacity from 0 to 1 fixes the problem.

http://codepen.io/calendee/pen/vlADg?editors=101
http://codepen.io/calendee/pen/wgrjL?editors=101

[louislecoeur]

I am experiencing a similar problem. Could you explain your workaround a bit more? Thank you.

[mhartington]

@calendee, seems to not work because you are not passing $event in the click-handler.

http://codepen.io/mhartington/pen/LgdsD

[calendee]

So true. Sorry I missed that.

[beetaa]

@calendee , @louislecoeur , There's another condition will trick the same bug: if you have defined an CSS class name "none" in your own, and let the "display" attribute with value "none", you will get this headache tricky bug, just like this:

.none {
  display: none;
}

why? because ionic will automatically add a "none" class in the "ion-popover-view" tag.

[r-cohen]

documentation should be updated to state that $event must be passed to the show method in order to work properly.

[mhartington]

@phearme this is already in the docs
http://ionicframework.com/docs/api/service/$ionicPopover/

[r-cohen]

@mhartington sorry but to me, the documentation is not clear enough. It should clearly state that passing $event to the show method is mandatory. The example is not enough.

[lastmjs]

The source code says you can pass in $event or the target element. It would be useful to me to be able to pass in the target element without an event, because I am programmatically calling show on the popover, instead of doing it through an ng-click.

Here is the source code:
https://github.com/driftyco/ionic/blob/master/js/angular/service/popover.js#L1

  /**
   * @ngdoc method
   * @name ionicPopover#show
   * @description Show this popover instance.
   * @param {$event} $event The $event or target element which the popover should align
   * itself next to.
   * @returns {promise} A promise which is resolved when the popover is finished animating in.
   */

[alxvallejo]

If i want to open the popover when the view loads, I can try ng-init="openPopover($event)" but $event is undefined. How can I show the popover when the view loads?

[juergengunz]

@alxvallejo did you find a solution for this ?

[ionitron-bot[bot]]

Thanks for the issue! This issue is being locked to prevent comments that are not relevant to the original issue. If this is still an issue with the latest version of Ionic, please create a new issue and ensure the template is fully filled out.