javascript - How to use bootstrap modal for multiple controllers? -

i want use same modal window different parent controller, difference in modal controller separate factories calling e.g ctrl-1-factory.getserverfiles want call ctrl-2-factory when modal populated ctrl2.

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'          }); 

you can wrap in service method.

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

pass in arguments needed make more robust