服务的离子模态窗口

Question

好吧,我有以下问题,我有一个模型窗口,我可以从控制器访问,问题是我需要它可以从多个控制器访问,所以我想我自己,"也许我可以创建工厂我可以注入我的控制器并从那里调用模态？" 所以我尝试了以下内容:

.factory('FSTestService', function ($rootScope, $ionicModal) {


    var completed = false;
    var loggedIn = false;


    // Create the ILS questionnaire modal that we will use later
    $ionicModal.fromTemplateUrl('templates/FS-Form-container.html', {
        scope: $rootScope
    }).then(function (modal) {

        $rootScope.FSModal = modal;

    });


    return {
        FSFrom: function () {
            $rootScope.FSModal.show();
        }
    }


})

然后在控制器上我试过:

.controller('CursosCtrl', function ($scope, CursosService, FSTestService) {

    FSTestService.FSForm;


})

但没有任何反应,如果我把"FSForm"称为函数,也就是说改变上述代码如下:

.controller('CursosCtrl', function ($scope, CursosService, FSTestService) {  
    FSTestService.FSForm();

})

我到处都是一堆错误,所以我的问题是,这甚至可能吗？什么是标准的进行方式？

Answer 1

我目前正在研究同样的问题,并找到了这个解决方案.我知道我已经很晚了,但迟到总比没有好!

angular.module('evenementoApp', ['ionic'])

.service('ModalService', function($ionicModal, $rootScope) {


  var init = function(tpl, $scope) {

    var promise;
    $scope = $scope || $rootScope.$new();

    promise = $ionicModal.fromTemplateUrl(tpl, {
      scope: $scope,
      animation: 'slide-in-up'
    }).then(function(modal) {
      $scope.modal = modal;
      return modal;
    });

    $scope.openModal = function() {
       $scope.modal.show();
     };
     $scope.closeModal = function() {
       $scope.modal.hide();
     };
     $scope.$on('$destroy', function() {
       $scope.modal.remove();
     });

    return promise;
  }

  return {
    init: init
  }

})

.controller('MainCtrl', function($scope, ModalService) {

  $scope.modal1 = function() {
    ModalService
      .init('modal1.html', $scope)
      .then(function(modal) {
        modal.show();
      });
  };

  $scope.modal2 = function() {
    ModalService
      .init('modal2.html')
      .then(function(modal) {
        modal.show();
      });
  };
})

然后只需从标记中调用$ scope.modal1()或$ scope.modal2()即可.