Как сделать событие ng-click условным?

У меня есть этот код внутри ng-repeat:

<a href="#" class="disabled" ng-click="doSomething(object)">Do something</a>

Как сделать условие, чтобы кнопка была отключена, когда она есть class="disabled"?

Или есть способ сделать это в Javascript, чтобы он выглядел так:

$('.do-something-button').click(function(){
  if (!$(this).hasClass('disabled')) {
    do something
  }
});

Нехорошо манипулировать DOM (включая проверку атрибутов) в любом месте, кроме директив. Вы можете добавить в область какое-либо значение, указывающее, должна ли ссылка быть отключена.

Но другая проблема заключается в том, что ngDisabled не работает ни с чем, кроме элементов управления формой, поэтому вы не можете использовать его с <a>, но вы можете использовать его с <button> и стилизовать его как ссылку.

Другой способ - использовать ленивую оценку выражений, например, isDisabled || action()чтобы действие не вызывалось, если isDisabledоно истинно.

Вот оба решения: http://plnkr.co/edit/5d5R5KfD4PCE8vS3OSSx?p=preview

Мы можем добавить событие ng-click условно, не используя отключенный класс.

HTML:

<div ng-repeat="object in objects">
<span ng-click="!object.status && disableIt(object)">{{object.value}}</span>
</div>

Я использую выражение &&, которое мне идеально подходит.

Например,

<button ng-model="vm.slideOneValid" ng-disabled="!vm.slideOneValid" ng-click="vm.slideOneValid && vm.nextSlide()" class="btn btn-light-green btn-medium pull-right">Next</button>

Если vm.slideOneValidложно, вторая часть выражения не запускается. Я знаю, что это помещает логику в DOM, но это быстрый грязный способ отключить ng и нажать ng-click, чтобы разместить красиво.

Просто не забудьте добавить к элементу ng-model, чтобы ng-disabled работал.

Обычно ng-clickсначала проверяется, isDisabledи на основе его значения он решает, следует ли вызывать функцию или нет.

<span ng-click="(isDisabled) || clicked()">Do something</span>

ИЛИ прочтите это как

<span ng-click="(if this value is true function clicked won't be called. and if it's false the clicked will be called) || clicked()">Do something</span>

Вы можете попробовать использовать ng-class.
Вот мой простой пример:
http://plnkr.co/edit/wS3QkQ5dvHNdc6Lb8ZSF?p=preview

<div ng-repeat="object in objects">
  <span ng-class="{'disabled': object.status}" ng-click="disableIt(object)">
    {{object.value}}
  </span>
</div>

Статус - это настраиваемый атрибут объекта, вы можете назвать его как хотите. В это имя класса CSS, то должно быть или
disabledng-classobject.statustruefalse

Вы можете изменить статус каждого объекта в функции disableIt.
В вашем контроллере вы можете сделать это:

$scope.disableIt = function(obj) {
  obj.status = !obj.status
}

У меня тоже была эта проблема, и я просто обнаружил, что если вы просто удалите "#", проблема исчезнет. Как это :

<a href="" class="disabled" ng-click="doSomething(object)">Do something</a>