Cómo cerrar el modo UU angular desde otro controller

Estoy usando Angular-ui para mostrar un modal con un formulario. Mi código es:

app.controller('NewCaseModalCtrl', ['$http', '$scope','$modal', function ($http, $scope, $modal, $log) { $scope.items = ['item1', 'item2', 'item3']; $scope.open = function (size) { var modalInstance = $modal.open({ templateUrl: 'modal-new-case.html', controller: 'ModalInstanceCtrl', size: size, resolve: { items: function () { return $scope.items; } } }); modalInstance.result.then(function (selectedItem) { $scope.selected = selectedItem; }, function () { }); }; }]); 

Y luego tengo otro controller que está dentro de la plantilla modal-new-case.html, y quiero que ejecute una request httpd y luego cierre ese modal, aquí está ese código:

  app.controller('CreateCaseFormCtrl', ['$http','$scope', function($http,$scope) { $scope.formData = {}; $scope.processForm = function() { $http.post('http://api.com/proj', $scope.formData). success(function(data, status, headers, config) { console.log("success " + data.id); }). error(function(data, status, headers, config) { console.log("Error " + status + data); }); }; 

}]);

Está bien, así que dentro de mi plantilla modal-new-case.html, que se carga cuando lo hago:

 ng-controller="NewCaseModalCtrl" 

Tengo este HTML:

 <div ng-controller="CreateCaseFormCtrl"> <form ng-submit="processForm()"> <button class="btn btn-primary" ng-click="processForm()" >OK</button> <button class="btn" ng-click="cancel()">Cancel</button> </form> </div> 

Entonces, si lo ven, lo que realmente quiero hacer es ejecutar esa function processForm (), y cuando vuelva con éxito, deseo ENTONCES llamar a la function que cerrará el modal, que creo que "cancel ()" haría estar bien.

Pero no sé cómo referirme a él desde el controller CreateCaseFormCtrl.

Agradezco cualquier pensamiento y ayuda, y me gustaría añadir que soy muy poco sofisticado cuando se trata de Angular, así que si esto es complicado, recuerden que tal vez no estoy 100% claro sobre qué es cada cosa en Angular como las fábricas y tal. Supongo que estoy diciendo que estoy muy contento con una solución sucia que es bastante simple, ya que este no será un código de progtwigción de producción a largo ploop.

Paso 1: eliminar el

 ng-controller="CreateCaseFormCtrl" 

de

 <div ng-controller="CreateCaseFormCtrl"> <form ng-submit="processForm()"> <button class="btn btn-primary" ng-click="processForm()" >OK</button> <button class="btn" ng-click="cancel()">Cancel</button> </form> </div> 

Paso 2: Cambiar

 controller: 'ModalInstanceCtrl', => controller: 'CreateCaseFormCtrl' 

en

 var modalInstance = $modal.open({ templateUrl: 'modal-new-case.html', controller: 'CreateCaseFormCtrl', //Add here size: size, resolve: { items: function () { return $scope.items; } } }); 

Paso 3: en CreateCaseFormCtrl agrega un service llamado $ modalInstance

 app.controller('CreateCaseFormCtrl', ['$http','$scope', '$modalInstance', function($http,$scope, $modalInstance) { 

Paso 4: agrega las funciones cerrar y aceptar

 $scope.cancel = function () { $modalInstance.dismiss(); }; 

y $ modalInstance.close (); en

 $http.post('http://api.com/proj', $scope.formData). success(function(data, status, headers, config) { console.log("success " + data.id); $modalInstance.close(); //add here }). error(function(data, status, headers, config) { console.log("Error " + status + data); }); 

use $ modalInstance.dismiss API

en NewCaseModalCtrl:

 controller('NewCaseModalCtrl', ['$scope', '$modalInstance', function ($scope, $modalInstance, ... $modalInstance.close(data); 

Usted lo hace globalmente así o desde otros controlleres también:

  //hide any open $mdDialog modals angular.element('.modal-dialog').hide(); //hide any open bootstrap modals angular.element('.inmodal').hide(); //hide any sweet alert modals angular.element('.sweet-alert').hide();