Как получить доступ к области действия $ modalInstance вне модели

Question

Я хочу обновить некоторое значение $modal в AngularJS, но не может понять, как я могу это сделать. Пример кода ниже:

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

Теперь, когда модель открылась успешно, и если я получил какое-то обновление от службы, и я снова хочу показать обновленные значения в модели, то как я могу вызвать updateStatus() снаружи модель. Я пытаюсь использовать modalInstance.updateStatus(..) Но это не работает. Может кто-нибудь сказать мне правильный способ сделать это?

Answer 1

Ты можешь использовать $broadcast чтобы вызвать этот метод. Например, после того, как вы получили обновление от вашего сервиса в контроллере вашего представления (куда вы звоните setupCall или запустив модал), сделайте так:

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

Теперь, внутри вашего контроллера модальных, зарегистрируйте слушателя для этого:

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

Answer 2

Вы можете передать scope возможность $modal, а затем использовать события AngularJS

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 3

Спасибо всем. Я решаю это, добавив пользовательский EventListener.

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