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();
            };
        }])

本人已經試驗成功。