Question

如何默认显示ionicPopover，不要点击或任何其他事件。加载页面或视图后，显示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

你非常接近。根据IonicPopover的官方文档，popover.show（）的语法如下：

show（$ event）其中popover应在旁边对齐的$ event或target元素

因此，按如下方式重写代码将完成工作：

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

完整示例，以及代码 - ＆gt; here

Answer 2

无需包含jQuery即可运行：

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

Answer 3

使用Ionic“utils”类（此处为DomUtil）的示例：

MY_HASH = ->(key) { { 1=>0, 2=>42 }[key] || -1 }
MY_HASH[1]            #=> 0
MY_HASH[529326] #=> -1

并非比其他答案更糟或更好。简单地避免使用直接DOM查询或jQuery。

在这里，我希望popover始终使用类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); });与项目对齐。

如何默认显示离子弹出窗口

3 个答案: