AngularJS - ng-disabled not working for Anchor tag

Question

There is no disabled attribute for hyperlinks. You can do this:

.disabled {
  cursor: not-allowed;
}

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

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

You could create a linkDisabled css class, and apply it to your anchor:

<style>

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

</style>

You can do this through CSS, no fancy directives needed. Just use ng-class to apply a class sort of like this:

ng-class:

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

css:

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

}

full credit to-

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

You can't disable anchor tag using ng-disabled.

Form control has disabled property but anchor tag has no disable property.

Check Why does angular's ng-disabled works with bootstrap's btn class?

You can user fieldset for enable disable a link.

<input type="checkbox" ng-model="vm.iagree"> I Agree
      <fieldset ng-disabled="!vm.iagree">
               <a class="btn btn-primary grey" href="javascript:void(0)" ng-click="vm.Submit()">Submit</a>
      </fieldset>