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-disabled 및 ng-click을 사용하여 멋지게 배치하는 빠르고 더러운 방법입니다.

ng-disabled 작동을 위해 ng-model을 요소에 추가하는 것을 잊지 마십시오.

기본적으로 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

function에서 모든 개체의 상태 를 변경할 수 있습니다 disableIt.
컨트롤러에서 다음을 수행 할 수 있습니다.

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

나는 또한이 문제가 있었고 단순히 "#"을 제거하면 문제가 발생한다는 것을 알았습니다. 이렇게 :

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