AngularJS - ng-disabled不适用于Anchor标记

Question

我正在使用ng-disabled,我喜欢它.它对我来说对输入和按钮很有用.锚标签不起作用.我该怎么办？

HTML code

<a ng-disabled="addInviteesDisabled()">Add</a>

JS code

  $scope.addInviteesDisabled = function() {
      return $scope.event.status === APP_CONSTANTS.STATUSES.PENDING_APPROVAL;
  };

Answer 1

超链接没有禁用属性.你可以这样做:

.disabled {
  cursor: not-allowed;
}

<a ng-click="disabled()" ng-class="{disabled: addInviteesDisabled()}">Add</a>

$scope.disabled = function() {
  if($scope.addInviteesDisabled) { return false;}
}

Answer 2

您可以创建一个linkDisabledcss类,并将其应用于您的锚点:

<style>

.linkDisabled {
  cursor: not-allowed;
  pointer-events: none;
  color: grey;
}

</style>

Answer 3

你可以通过CSS做到这一点,不需要花哨的指令.只需使用ng-class来应用类似这样的类:

NG-类:

ng-class="{disabledLink: disabledFunction()}"

CSS:

.disabledLink {
    color: #ccc;
    pointer-events:none;

}

完全信贷 -

https://css-tricks.com/pointer-events-current-nav/

Answer 4

您无法使用禁用锚标记ng-disabled.

表单控件已禁用属性,但锚标记没有禁用属性.

检查为什么angular的ng-disabled与bootstrap的btn类一起工作？