Angularjs Пользовательские Директива нг щелкните не работает

Question

я создал пользовательскую директиву angularjs:

directives.directive('myTop',function($compile) { 
return { 
    restrict: 'E', 
    templateUrl: 'views/header.html', 
} 
}) 

код директивы:

<div class="my-header"> 
<button ng-click="alert('x')" class="fa fa-chevron-left"></button> 
<h1>SpeakZ</h1> 
</div> 

по какой-то причине, нг-нажмите doesen't курок.

Я искал через Интернет и обнаружил, что компиляция/ссылка является решением этой проблемы, , но я не могу найти рабочего решения.

Я не использую JQuery ..

Answer 1

Вам нужно добавить link функцию определения директивы для этой работы. Таким образом, в основном,

var app = angular.module("myApp", []) 

app.directive('myTop',function() { 
return { 
    restrict: 'E', 
    template: '<button ng-click="clickFunc()">CLICK</button>', 
    link: function (scope) { 
     scope.clickFunc = function() { 
      alert('Hello, world!'); 
     }; 
    } 
} 
}) 

И HTML:

<div ng-app="myApp"> 
    <my-top></my-top> 
</div> 

И вот скрипку: http://jsfiddle.net/4otpd8ah/

Answer 2

Либо используйте ссылку, как ответил на @Ashesh или просто добавить объем. Если вы установите область false, у вас не будет выделенной области, и щелчок будет работать с директивой.

directives.directive('myTop',function($compile) { 
return { 
    restrict: 'EA', 
    scope: false, 
    templateUrl: 'views/header.html', 
    } 
})