ng-repeat: игнорировать многократную вставку одного и того же углового шаблона директивой

Question

Я погуглил мою проблему, но не смог найти решение.Я надеюсь, что теперь я определенно получу один.

Я делаю директиву в угловых JS.для создания кликабельной ссылки на повторяемый текст.

Допустим, у меня есть несколько ваучеров, которые я хочу показать с помощью ng-repeat, и я хочу создать директиву, которая открывает модальное окно с деталями всех транзакций вit.

Моя проблема в том, что ng-repeat вставляет модальный шаблон в каждый цикл, который, я думаю, замедляет DOM.

Директива:

.directive('viewVoucher', function($rootScope, CommonFunctionService, Server, $state, TplBaseUrl) {
return {
    restrict: 'E',
    scope: {
        voucherNumber:'@',
        voucherDate:'@',            
    },
    link: function(scope, element, attrs) {
    },
    templateUrl: TplBaseUrl()+'commonTpl/voucherViewModal.php',
    controller: function($scope, $element) {
        $scope.title = "Angularjs Bootstrap Modal Directive Example";
        $scope.showModal1 = false;

        $scope.hide = function(){
            $scope.showModal1 = false;
        }

        $scope.modalOneShown = function(){
            //console.log('model one shown');
            var params = {
            };
            Server.getInstance({apiName: 'someAPI'})
                .request('functionName',params,function(data) {
                if(CommonFunctionService.handleResponse(data)) {
                    $scope.voucherDetails = data.response; 
                } 
            });
        }

        $scope.modalOneHide = function(){
            //console.log('model one hidden');
        }
    },
};
})

Если я использую указанную выше директиву в ng-repeat, модальный шаблон вставляется каждый раз