Angularjs自定义指令NG单击不工作 [英] Angularjs Custom Directive ng-click not working

问题描述

我创建了一个自定义的指令，在angularjs：

i've created a custom directive in angularjs:

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

指令的code：

Directive's code:

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

出于某种原因，纳克单击doesen't触发

for some reason, ng-click doesen't trigger.

我搜索在互联网上，发现编译/链接是这个问题的解决方案，
但我似乎无法达成工作的解决方案。

I searched over the internet and found that compile / link is the solution for this problem, but I can't seem to reach a working solution.

我不使用jQuery的..

I am not using jquery..

推荐答案

您将需要一个链接函数添加到指令定义这个工作。所以基本上，

You'll need to add a link function to the directive definition for this to work. So basically,

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/

这篇关于Angularjs自定义指令NG单击不工作的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！