Как связать ng-click с обработчиком события, определенным внутри директивы?

Question

Все:

Я определяю директиву как:

.directive("hellobutton", function(){ 
    return { 
     restrict: "AE", 
     scope: {}, 
     controller: function($scope){ 
      $scope.sayhello = function(){ 
       console.log("hello"); 
      } 
     } 
    } 
}) 

Интересно, как я могу использовать, что SayHello обработчик на эту директиву, как:

<hellobutton ng-click="sayhello()"></hellobutton> 

В принципе я не хочу, чтобы пройти SayHello от внешнего охвата, но пусть это внутренняя область действия справки справится с этим.

Интересно, возможно ли это, или я должен определить этот обработчик внутри шаблона?

Answer 1

Вы хотите передать функцию в качестве параметра:

.directive("hellobutton", function(){ 
    return { 
     restrict: "AE", 
     scope: { 
      callback: '&' 
     }, 
     controller: function($scope){ 
      $scope.callback(); 
     } 
    } 
}) 

и

<hellobutton callback="sayhello()"></hellobutton> 

Answer 2

Да, вы можете. Просто определите директиву со ссылкой и привяжите событие click. Затем он может быть прикреплен к любому элементу. См plunker

JS:

app.directive("hellobutton", function(){ 
    return { 
     restrict: "A", 
     link: function(scope, elem, attr) { 
      elem.on('click', function() { 
      console.log("hello"); 
      }) 
     } 
    } 
}) 

Markup:

<button type="button" hellobutton="">Click Me, I'm a button</button> 
<div hellobutton="">Click me too, I'm a DIV</div>