禁用ng-click HTML DOM元素

Question

我有一个具有ng-click属性的<a>元素。 在某些情况下，我想禁用ng-click此元素。 我正在使用jquery来找到这个元素，我试图通过各种可能的方式停止点击。 例如： return false ; event.stopPropagation()等。另外，我删除了ng-click属性

$(element).removeAttr('ng-click');

，但事件仍在解雇。 是否可以通过jquery停止（禁用） ng-click ？

Answer 1

第一选择

您始终可以在锚元素上添加disabled属性，以防止触发ng-click 。 添加禁用属性时还需要使用CSS。 请参阅下面的工作示例

 var app = angular.module("sa", []); app.controller("FooController", function($scope) { $scope.sayHello = function() { alert("Hello!!"); }; }); 

 a[disabled] { pointer-events: none; } 

 <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> <div ng-app="sa" ng-controller="FooController"> <a href="" disabled ng-click="sayHello()">Say Hello</a> </div> 

第二种选择

您可以使用指令删除ng-click 。 但这不适用于jQuery，即如果你使用jQuery添加这个指令，它将无法正常工作。

 var app = angular.module("sa", []); app.controller("FooController", function($scope) { $scope.sayHello = function() { alert("Hello!!"); }; }); app.directive("disableclick", function() { return { restrict: 'A', priority: 1000, // setting higher priority to let this directive execute before ngClick compile: function(element, attr) { attr.ngClick = null; } } }); 

 <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> <div ng-app="sa" ng-controller="FooController"> <a href="" disableclick ng-click="sayHello()">Say Hello</a> </div> 

Answer 2

如果你想以Angular方式进行，你应该在元素上使用ng-disabled，如：

<a ng-click="someClickHandler()" ng-disabled="isDisabled">Link</a>

除非你知道自己在做什么，否则替换DOM中的元素是一个非常糟糕的主意。 如果有任何绑定，则需要首先编译该元素。

如果这不起作用，请尝试使用按钮替换元素。

Answer 3

我是如此接近..找到解决方案..

var temp = $(result.element).removeAttr('ng-click');
$(result.element).replaceWith(temp);

我只需要用新的元素替换旧元素，但在此之前，必须删除属性然后它才能正常工作。