UPDATE. Solved by broadcasting the event.

Hi everybody,

I have the following interface (the picture is attached). From the Index page of Accounts I open an account. There is a 'Remove Duplicate' button that opens the modal dialog allowing to remove the duplicates.

The remove duplicate can potentially remove the account we started from. So, upon the closing of the modal form (which is implemented as a following directive) I want to close the current account form and re-launch a search.

My problem is - how can I 'hook up' to the close functionality of that modal form? The modal directive has the following code

(function () {
    'use strict';
    // <modal-popup class="btn btn-default" modal-title="Please confirm" link-text="Release Lock"
    //    modal-message="{{canUseAFunction()}}" ok-label="Yes" ok-action="releaseLock(currentItemTree.node_id)" cancel-label="Cancel"></modal-popup>
    var app = angular.module('sysMgrApp');

    app.directive('modalPopup', ['resourceFactory', function (resourceFactory) {
        return {
            restrict: 'AE',
            transclude: false,
            scope: {           
                okLabel: '@?',
                cancelLabel: '@?',
                modalTitle: '@?',
                modalMessage: '=',
                onOpen: '&',
                okAction: '&',
                disableAction: '=',
                obj: '=',
                stopPropogation: '@',
                modalTemplate: '@?'//,
                //showModal: '='
            },
            link: function (scope, element, attrs) {
                scope.trigger = false;
                element.click(function (e) {
                    scope.click(e);
                    //console.log('dataObject1' + JSON.stringify(scope.obj));
                    //if (scope.stopPropogation) {
                    //    window.console && console.log('stoping prop: ');
                    //    e.stopPropogation();
                    //}
                });
                //scope.$watch('showModal', function (newValue, oldValue) {
                //    console.log('trigger' + newValue);
                //    if (newValue) {
                //        scope.click();                       
                //    }
                //}, true);
            },
            controller: ['$scope', '$modal', function ($scope, $modal) {
                $scope.okClass = 'btn-danger';
                $scope.message = $scope.modalMessage;
                $scope.title = $scope.modalTitle;
                $scope.okLabel = $scope.okLabel || resourceFactory.getResource('Labels', 'ok');
                $scope.cancelLabel = $scope.cancelLabel || resourceFactory.getResource('Labels', 'cancel');
                $scope.click = function (event) {
                    
                    if ($scope.onOpen) {
                        console.log('opening');                        
                            $scope.onOpen();
                    }                    
                        var modal = $modal.open({                            
                            scope: $scope,
                            templateUrl: ($scope.modalTemplate != null && $scope.modalTemplate.length > 0) ? $scope.modalTemplate : 'app/templates/modalAddOn'
                        });

                        modal.result.then(function (result) {
                            console.log('okAction is called...');
                            $scope.okAction();
                        });
                       
                    };              
            }]
        };
    }]);
})();

and the template used for that particular form is using at the top:

<div class="modal-header">
    <button type="button" class="close" data-dismiss="modal" ng-click="$dismiss()" aria-hidden="true">×</button>
    <h4 class="modal-title" style="text-align:center">@Labels.deDupe</h4>
</div>

It would also be nice to only perform the logic if we indeed 'removed the duplicates' and not just opened that form and closed.

Do you have ideas for functionality?

Thanks in advance.