angularjs - 防止 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 中计算的表达式指示。如果它没有被评估为真，那么 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是真的， something()不会被调用，按钮也将被禁用!