Zugriff auf den modalInstance $ Bereich von außerhalb des Modells

Question

Ich möchte einen Wert von $modal in AngularJS aktualisieren, aber nicht verstehen, wie ich dies tun kann. Beispielcode ist unten:

var modalInstance; 

    function setupCall(data) { 

    var templateURL = 'partials/Chat.html'; 
    var cssClass = 'medium-Modal'; 
    modalInstance = $modal.open({ 
     backdrop: "static", 
     keyboard: false, 
     backdropClick: false, 
     windowClass: cssClass, 
     templateUrl: templateURL, 
     controller: function ($scope, $modalInstance) { 


      $scope.updateStatus=function() { 
      ... 
      } 
     } 
    }); 
    modalInstance.result.then(function() { 

    }); 
} 
// first time i call this function to open model 
setupCall(event); 

Und als Modell erfolgreich öffnen und wenn ich erhielt einige Update von Service und ich möchte wieder in einem Modell aktualisierten Werte zeigen dann, wie ich updateStatus() von außerhalb des Modells aufrufen können. Ich versuche modalInstance.updateStatus(..) zu verwenden, aber es funktioniert nicht. Kann mir jemand einen richtigen Weg sagen, dies zu tun?

Answer 1

Sie können eine scope Option $modal, übergeben und dann AngularJS Ereignisse

var modalScope = $rootScope.$new(); 

myService.doSomethingAsync(function (data) { 
    $rootScope.$emit('some event', data); 
}); 

$modal.open({ 
    scope: modalScope, 
    controller: function ($scope) { 

    /* ... */ 

    $scope.$on('some event', function() { 
     $scope.updateStatus(); 
    }); 
    } 
}); 

Answer 2

Sie können $broadcast diese Methode verwenden Anruf verwenden. Zum Beispiel, nachdem Sie Update von Ihrem Service in Ihrer Ansicht des Controllers erhalten (wo Sie setupCall oder den Start des modalen fordern), dies zu tun:

$rootScope.$broadcast("dataUpdatedFoo", {newData: "bar")); 

nun in Ihrem Controller modaler, registrieren Sie einen Listener für diese:

$scope.$on("dataUpdatedFoo", function(e, data) { 
    $scope.updateStatus(); 
}); 

Answer 3

Danke an alle. Ich löse dies, indem ich einen benutzerdefinierten Eventlistener hinzufüge.

var listeners = []; 

function _addEventListener(listener) { 
    listeners.push(listener); 
    return listener; 
} 

function _removeListener(listener) { 
    for (var i=0; i < listeners.length; i++){ 
     if (listeners[i] === listener){ 
      listeners.splice(i, 1); 
      break; 
     } 
    } 
} 
function setupCall(data) { 
    ...... 
    modalInstance = $modal.open({ 
     backdrop: "static", 
     keyboard: false, 
     backdropClick: false, 
     windowClass: cssClass, 
     templateUrl: templateURL, 
     controller: function ($scope, $modalInstance) { 

      var listener = _addEventListener(function (event) { 
       $log.info("chat msg: "+JSON.stringify(event)); 
      }); 

      $scope.$on('destroy', function() { 
       _removeListener(listener) 
      }); 
      ...