Вызов функции родительской области с директивой

Question

Я создаю директиву, открывающую окно с угловым бутстрапом. При закрытии модального я хотел бы иметь функцию казнены, которая передается от атрибута директивы .. Вот что я до сих пор:

Это на index.tpl.html:

<popup class="something" .. on-close="update()"></popup> 

код Директивы, только определение сферы, так как есть много коды до этого:

scope: { 
     onClose: "&" 
     }, 
link: function(scope, element, attr){ 
      //some code  
      ...... 
      scope.closeFn = function(){ 
       scope.onClose(); 
     } 
     //opening of the modal: 
     var modalInstance = $modal.open({ 
        .... 
        templateUrl: 'path/to/template.tpl.html, 
        controller: 'PopupController', 
        scope: scope, 
        .... 
     }); 

в шаблоне всплывающего окна я функция связанного приложения к кнопке закрытия, которая вызывает функцию в «PopupController» который вызывает функцию closeFn из функции ссылки.

<button type="button" class="btn-close btn btn-large" ng-click="closePopup()">Close 
    </button> 

И в 'PopupController':

$scope.closeUploadPopup = function() { 
     $scope.$parent.closeFn(); 
     $modalInstance.close(); 
    }; 

Насколько я понимаю scope.onClose() должен выполнить функцию, указанную в атрибуте на-близко?

Я не предоставил много кода, так как есть много исходного кода, но я могу добавить больше, если это поможет.

Answer 1

Вам необходимо использовать надлежащий API $modal. Таким образом, modalInstance имеет свойство promise, которое вы можете использовать для «подписания», чтобы получать уведомление, когда всплывающее окно закрыто (кнопка «ОК») или отклонено (кнопка «Отмена»).

scope: { 
    onClose: "&" 
}, 
link: function(scope, element, attr) { 
    // ... some code  
    var modalInstance = $modal.open({ 
     // .... 
     templateUrl: 'path/to/template.tpl.html', 
     controller: 'PopupController', 
     scope: scope, 
     // .... 
    }); 

    modalInstance.result.then(function() { 
     scope.onClose(); // close handler 
    }, function() { 
     // dismiss handler 
    }); 

}; 

И при использовании шаблона всплывающего $close и $dismiss методы:

<button type="button" class="btn-close btn btn-large" ng-click="$close()">Close</button> 

Answer 2

Как вы присваиваете новый controller к вашему модального всплывающего окна, нет необходимости назначать scope свойство, которое в любом случае собирается быть игнорируются.

Для сделать это работает, я хотел бы предложить вам пройти эту ссылку на метод с решимостью вашего модального всплывающего окна

var modalInstance = $modal.open({ 
    templateUrl: 'path/to/template.tpl.html', 
    controller: 'PopupController', 
    resolve: { 
     onClose: scope.onClose 
    }, 
    //.... 
}); 

Контроллер

app.controller('PopupController', function($scope, onClose){ 
    $scope.closeUploadPopup = function() { 
     onClose(); 
     $modalInstance.close(); 
    }; 
}) 

Answer 3

Может быть, это диалоговое окно директива может помочь вам ,

Вы можете настроить 1. Диалог название 2. Тело сообщения 3. Кнопка те отображаются в диалоговом окне и соответствующего действия

<ng-dialog button="Yes|okFunction ,No|cancelFunction" dialogid="id-bootstrap" header="Angular Modal Dialog Directive " message="Hello World" theme="bootstrap"> 
</ng-dialog> 

диалоговое окно с двумя кнопками 1) Да и 2) Нет. okFunction и cancelFunction вызывается при клике. Эти функции определены в контроллере.

См. Ссылку ниже.

http://yogeshtutorials.blogspot.in/2015/12/angular-modal-dialog-directive.html