Come mostrare ionicPopover di default

Question

Come mostrare ionicPopover per impostazione predefinita, non fare clic o nessun altro evento. Una volta caricata la pagina o la vista, mostra il 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

Eri molto vicino. Secondo la documentazione ufficiale del IonicPopover, La sintassi di popover.show() è la seguente:

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

Quindi, riscrivere il codice farà il lavoro nel modo seguente:

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

Complete Esempio, insieme con il codice di ->here

Answer 2

Questo funziona senza dover includere jQuery:

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

Answer 3

Un esempio che usa ionici "utils" classi (qui, 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); 
    }); 

Non proprio migliore o peggiore di altre risposte. Evita semplicemente l'uso di query DOM dirette o jQuery.

Qui, voglio che il popover sia sempre allineato all'elemento utilizzando la classe .target-host-item-class.