在Angular Directive的链接函数中使用ng-click vs bind

在链接函数中，是否存在将函数绑定到click事件的更多“角度”方式？

现在，我在做...

myApp.directive('clickme', function() {   
  return function(scope, element, attrs) {
    scope.clickingCallback = function() {alert('clicked!')};
    element.bind('click', scope.clickingCallback);   
} });

这是Angular的方式还是丑陋的破解？也许我不应该这么担心，但是我是这个框架的新手，并且想知道“正确”的做事方式，尤其是随着框架的发展。

您可以在指令中使用控制器：

angular.module('app', [])
  .directive('appClick', function(){
     return {
       restrict: 'A',
       scope: true,
       template: '<button ng-click="click()">Click me</button> Clicked {{clicked}} times',
       controller: function($scope, $element){
         $scope.clicked = 0;
         $scope.click = function(){
           $scope.clicked++
         }
       }
     }
   });

在plunkr上的演示

Angular guide中有关指令的更多信息。对我来说非常有用的是Angular官方博客文章中关于这些指令的视频。

我认为这很好，因为我已经看到很多人这样做。

如果仅在指令中定义事件处理程序，则不必在作用域上定义它。跟随会很好。

myApp.directive('clickme', function() {
  return function(scope, element, attrs) {
    var clickingCallback = function() {
      alert('clicked!')
    };
    element.bind('click', clickingCallback);
  }
});

它不应该仅仅是：

<button ng-click="clickingCallback()">Click me<button>

为什么要编写一个新指令，只是将click事件映射到作用域上的回调？ng-click已经为您做到了。

您应该在指令中使用控制器，并在模板html中ng-click，如先前建议的那样。但是，如果需要在事件（单击）上执行DOM操作，例如单击按钮时，则要更改按钮的颜色等，然后​​使用Link函数并使用元素来控制dom。

如果您要做的只是在HTML元素或任何此类非dom操纵任务上显示一些值，则您可能不需要指令，可以直接使用控制器。

在这种情况下，不需要指令。这可以做到：

<button ng-click="count = count + 1" ng-init="count=0">
  Increment
</button>
<span>
  count: {{count}}
</span>

来源：https：//docs.angularjs.org/api/ng/directive/ngClick

myApp.directive("clickme",function(){
    return function(scope,element,attrs){
        element.bind("mousedown",function(){
             <<call the Controller function>>
              scope.loadEditfrm(attrs.edtbtn); 
        });
    };
});

这将充当属性clickme的onclick事件