如何为多个控制器使用引导模态

How to use bootstrap modal for multiple controllers?

本文关键字：模态 控制器      更新时间：2023-09-26

我想用不同的父控制器使用相同的模态窗口，模态控制器的唯一区别是我正在调用的单独工厂，例如Ctrl-1-Factory.getServerFiles，所以同样我想在Ctrl2填充模态时调用Ctrl-2-Factory。

ModalCtrl.js 

angular.module('App').controller('ServerFilesCtrl', function($scope, $rootScope, FileSaver, $uibModalInstance, Ctrl-1-Factory, $uibModal) {
    'use strict';
    $scope.cancel = function() {
        $uibModalInstance.close();
    }
    Ctrl-1-Factory.getServerFiles().then(function(response) {
        $scope.data = response.data;
        console.log($scope.data);
    });
});

ctrl - 1. - js 

 $scope.modalInstance = $uibModal.open({
         templateUrl: '/web/global/modal.html',
            controller:'ModalController'
         });

ctrl - 2. - js 

 $scope.modalInstance = $uibModal.open({
         templateUrl: '/web/global/modal.html',
            controller:'ModalController'
         });

你可以把它封装在一个service方法中。

angular.module('App').factory('FilesModal', function() {
  return {
    openModal: openModal
  };
  function openModal() {
    return $uibModal.open({
      templateUrl: '/web/global/modal.html',
      controller: 'ModalController'
    });
  }
});
angular.module('App').controller('Ctrl1', function(FilesModal) {
  $scope.someEventFunction = someEventFunction;
  function someEventFunction() {
    $scope.modalInstance = FilesModal.openModal();
  }
});

根据需要传入参数使其更健壮

相关文章：