防止对禁用按钮的ng-click =""效果

Question

如何防止AngularJS点击具有"禁用"属性的HTML按钮标记？

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<button type="button" disabled ng-click="something()">No Click Please!</button>

在这种情况下,不应该调用something().

Answer 1

传递必须在ngClick指令中计算的表达式.如果未评估为true,则something()不会被调用.

下面是一个例子:

(function() {

  angular.module('MyApp', [])
    .controller('MyController', MyController);

  MyController.$inject = ["$scope"];

  function MyController($scope) {

    $scope.disabled = true;

  }

})();

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>

<div data-ng-app="MyApp">

  <div data-ng-controller="MyController">

    <button type="button" ng-disabled="disabled" ng-click="disabled || something()">No Click Please!</button>

    <button type="button" data-ng-click="disabled = !disabled">{{disabled ? 'Enable' : 'Disable'}}</button>

  </div>

</div>

请注意,您也可以使用该ngDisabled指令,如果$scope.disabled为true,something()则不会被调用,该按钮也将被禁用!