ionic中$ionicPopover和$ionicModal

Popover可点多个按钮弹出同一个浮动框但内容不一样。那想要在同一页面弹出不同的浮动框怎么办呢？

这事就用到了$ionicModal，他和$ionicPopover一样的用法。

请看图：

html：

controller.js：

 angular.module('ionicApp', ['ionic'])
        .controller( 'AppCtrl',['$scope','$ionicPopover','$ionicModal','$timeout',function($scope,$ionicPopover,$ionicModal,$timeout){
          $scope.popover = $ionicPopover.fromTemplateUrl('my-popover.html', {
            scope: $scope
          });
          $ionicPopover.fromTemplateUrl('my-popover.html', {
            scope: $scope
          }).then(function(popover) {
            $scope.popover = popover;
          });
          $scope.openPopover = function($event) {
            $scope.popover.show($event);
          };
          $scope.closePopover = function() {
            $scope.popover.hide();
          };
            $ionicModal.fromTemplateUrl('my-modal.html', {
                scope: $scope,
            }).then(function(modal) {
                $scope.modal = modal;
            });
            $scope.openModal = function() {
                $scope.modal.show();
            };
            $scope.closModal = function() {
                $scope.modal.hide();
            };
        }])

本人已经试验成功。

 

转载于:https://www.cnblogs.com/happiness-mumu/p/6236815.html