How to show ionicPopover by default

Question

How to show ionicPopover by default, don't click or any other event. Once the page or the view loaded, show the popover?

cmr.controller('JoinMeeting', function($scope, $ionicPopover) {
    $ionicPopover.fromTemplateUrl('joinMrTips.html', {
    scope: $scope,
}).then(function(popover) {
    $scope.popover = popover;
});

$scope.$on('$viewContentLoaded',function(){
    $scope.popover.show();
});

})

Answer 1

You were very close. According to the official documentation of IonicPopover, The syntax of popover.show() is as follows :

show($event) where The $event or target element which the popover should align itself next to

Hence, rewriting your code as follows will do the job :

$scope.$on('$viewContentLoaded',function(){
    $scope.popover.show(".class-of-host-control-of-popup");
});

Complete Example, along with code --> here

Answer 2

This works without having to include jQuery:

$scope.$on('$viewContentLoaded',function(){
  $scope.popover.show(angular.element(document.querySelector('.class-of-host-control-of-popup')));
});

Answer 3

An exemple which uses Ionic "utils" classes (here, DomUtil):

    var nodeClass = 'target-host-item-class';
    var evtTarget = $event.target;
    var hostNode = ionic.DomUtil.getParentOrSelfWithClass(evtTarget, nodeClass);

    $ionicPopover.fromTemplateUrl('popover-template.html', {
        scope: $scope
    }).then(function(popover) {
        popover.show(hostNode);
    });

Not really worse or better than other answers. Simply avoids using direct DOM queries or jQuery.

Here, I want the popover to always be aligned with the item using the class .target-host-item-class.