AngularJS - ng-disabled не работает для тега Anchor

Вы можете создать класс linkDisabled css и применить его к своему якорю:

<style>

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

</style>

Вы не можете отключить тэг привязки с помощью ng-disabled.

Контроль формы отключил свойство, но тег привязки не имеет свойства disable.

Проверить Почему angular ng-disabled работает с классом btn bootstrap?

Вы можете сделать это через CSS, не требуя каких-либо причудливых директив. Просто используйте ng-класс, чтобы применить класс вроде следующего:

нг-класс:

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

CSS

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

}

полный кредит -

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

Да, мы можем отключить тег привязки, чтобы увидеть, что нужно сделать. Якорь доступен для кликабельности, сначала мы отключили его, мы можем сделать это с помощью указателей-событий: none; а затем, чтобы показать, что использование отключено, мы можем изменить цвет, на котором мы должны отключить его, как цвет: # 95979A;. Тем не менее нам нужно понять, что здесь происходит, добавив выше, не отключит событие click тега привязки. Чтобы остановить это, нам нужно добавить ng-disabled, который добавляет событие атрибута как disabeld = disabled. Нам нужно поймать это с помощью [disabled].

Итак, окончательный код: a [отключено] {указатель-события: нет; цвет: # 95979A;}  отключит событие click тега привязки.

Надеюсь, это помогло. Благодаря

На этот вопрос был дан ответ: Включить/отключить привязывающие метки с помощью AngularJS

Используйте настраиваемую директиву или используйте кнопку.

У меня была та же проблема, что и кнопки навигации, этот обходной путь был хорошим решением для моего проекта!

<a href="{{nextItem ? '/the-link/i-want-to-use' : '#'}}" ng-class="{'iamDisabled':!nextItem}">Some link text</a>

В принципе, есть две кнопки (сделанные с тегами ссылок), одна для следующей и другая для предыдущих. есть две переменные $scope, nextItem и prevItem, по одному для каждой кнопки. Поэтому, если нет следующего (или предыдущего) тега, он будет выглядеть правильно (так что вы увидите его отключен).

Когда nextItem не является нулевым, href будет отображаться в href="/the-link/i-want-to-use", а когда будет null, href будет href="#".

Лучший способ - добавить отключенное условие в функцию якоря. Таким образом, функции выполняются только в том случае, если отключенное условие проверено и прошло.

$scope.next_kh_resource = function(){
    if ($scope.selected_kh_index < ($scope.selected_step.step_kh_resources.length -1)){
        var next = $scope.selected_kh_index + 1;
        $scope.selected_kh_index = $scope.selected_kh_index +1;
        $scope.selected_kh_resource = $scope.selected_step.step_kh_resources[next];
    }
}
$scope.prev_kh_resource = function(){
    if ($scope.selected_kh_index > 0){
        var prev = $scope.selected_kh_index -1;
        $scope.selected_kh_index = prev;
        $scope.selected_kh_resource = $scope.selected_step.step_kh_resources[prev];
    }

}

В приведенном выше примере я отключил привязки привязки страниц next и prev, вставив в функции отключенное условие. Умные пользователи. Они скоро узнают, что это конечная страница, и они могут щелкнуть дальше, но ничего не произойдет

Когда ng-Disabled оценивается как true, устанавливает атрибут disabled для элемента, который обычно является вводом или другим элементом управления формой. В тегах <a> нет атрибутов disabled, поэтому он никогда не будет установлен. Попробуйте установить ng-Disabled по вашей ссылке на true, и вы сами увидите.

Может быть, это поможет: ng-disabled И привязки тегов Oh Noes!

Использовать a-disabled вместо ng-disabled

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