禁用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);

我只需要用新的元素替換舊元素，但在此之前，必須刪除屬性然后它才能正常工作。