Отправить событие в функцию угловых директив в области

Question

Я пытаюсь создать директиву с угловым для отображения мультиселекта, который загружает свои параметры в шаблон с помощью ajax-вызова. Вот моя директива сейчас:

function AngularMultiselect() { 
    return { 
     restrict: 'E', 
     replace: true, 
     templateUrl: 'temp.html', 
     scope: { 
      tipo: "@" 
     }, 
     link: function(scope, element, attrs){ 
      scope.open_tab = function(){ 
       element.addClass('open'); 
       $(document).on("click",function(){ //beign called at the same time 
        console.log("document clicked"); 
       }); 
      }; 
      console.log('multiselect being called'); 

     } 
    } 
} 

HTML:

<filtro tipo="client"></filtro> 

Внутри шаблона:

<button type="button" 
     class="multiselect btn" 
     ng-click="open_tab()"> 

У меня есть проблема в том, что вкладка открывается и закрывается в то же мыши , Я бы использовал событие, чтобы остановить распространение события, но я не могу его отправить ... Я попробовал open_tab($event), но затем $event содержит 'client'. Есть идеи?

Здесь вы можете увидеть его работы: http://codepen.io/vandervals/pen/VeZrdV

Answer 1

Просто перенести обработчик нажмите документ приложить, чтобы избежать этой проблемы:

вместо:

scope.open_tab = function(){ 
       element.addClass('open'); 
       $(document).on("click",function(){ //beign called at the same time 
        console.log("document clicked"); 
       }); 
      }; 

просто сделать:

scope.open_tab = function(){ 
    element.addClass('open'); 
    $timeout(function() { 
    $(document).on("click",function(){ //no longer beign called at the same time 
     console.log("document clicked"); 
    }); 
    }, 1, false); 
}; 

Чтобы избежать начального события щелчка, чтобы запустить второй h andler