如何使一个 n- 点击事件有条件？

我在 n 里面有这个代码-重复:

<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
}
});
192066 次浏览
小开
最佳答案

除了指令之外，在任何地方使用 DOM (包括检查属性)操作都是不好的。您可以在范围中添加一些值，指示是否应该禁用链接。

但是另一个问题是 ngDisable 除了表单控件之外不能在其他任何地方工作，所以不能用 < a > 来使用它，但是可以用 < 按钮 > 来使用它，并将其样式设置为链接。

另一种方法是使用像 isDisabled || action()这样的表达式的延迟计算，这样当 isDisabled为 true 时就不会调用 action。

这是两种解决方案: http://plnkr.co/edit/5d5R5KfD4PCE8vS3OSSx?p=preview

小开

你可以尝试使用 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>

状态是对象的一个自定义属性，您可以随意命名它。
ng-class中的 disabled是一个 CSS 类名，object.status应该是 true或 false

You could change 每个物体的状态 in function disableIt.
在 Controller 中，您可以这样做:

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

我们可以在不使用禁用类的情况下有条件地添加 ng-click 事件。

HTML:

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

I had this issue also and I simply found out that if you simply remove the "#" the issue goes off. Like this :

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

我使用的 & & 表达式对我来说非常适用。

比如说,

<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>

If vm.slideOneValid is false, the second part of the expression is not fired. I know this is putting logic into the DOM, but it's a quick a dirty way to get ng-disabled and ng-click to place nice.

只要记住向元素添加 ng- 模型，就可以使 ng- 禁用工作。

小开

基本上，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>

提交答案