问题描述
在AngularJS中,有什么方法可以使ng-click
依赖于布尔值吗?
In AngularJS, is there any way to make an ng-click
dependent upon a boolean?
例如,我希望以下文本(点击")可被单击,但当某些范围属性(例如,$rootScope.enableClick
)为true
时,则仅单击 .
For example, I'd like the following text ("Click") to be clickable, but only when some scope property (e.g., $rootScope.enableClick
) is true
.
<div ng-click="count = count + 1" ng-init="count=0">Click</div>
最好,有没有一种简单的方法就可以执行此操作而无需创建自定义指令?
Preferably, is there a straightforward way to do this without creating a custom directive?
推荐答案
使用奇妙的 &&
逻辑运算符在ng-click
表达式中:
Use the strange and wonderfull &&
logical operator in the ng-click
expression:
<div ng-click="!stop && (count = count + 1)">Click me</div>
演示
.clickable {
cursor: pointer;
}
<script src="//unpkg.com/angular/angular.js"></script>
<body ng-app ng-init="count=0">
<div ng-click="!stop && (count = count + 1)" class="clickable" >Click Me</div>
<div>Count={{count}}</div>
<input type="checkbox" ng-model="stop">Stop counting<br>
</body>
或将与 ng-disabled 指令:
<button ng-click="count = count + 1" ng-disabled="stop" >Click Me</button>
禁用ng的指令不适用于<div>
元素. disabled
属性不是全局属性. ng-disabled
指令仅适用于<input>
,<button>
,<textarea>
和<select>
元素,因为这些元素支持 disabled
属性.
The ng-disabled directive does not work with <div>
elements. The disabled
property is not a global attribute. The ng-disabled
directive only works with <input>
, <button>
, <textarea>
, and <select>
elements as those elements support the disabled
property.
<script src="//unpkg.com/angular/angular.js"></script>
<body ng-app ng-init="count=0">
<button ng-click="count = count + 1" ng-disabled="stop" >Click Me</button>
<div>Count={{count}}</div>
<input type="checkbox" ng-model="stop">Stop counting<br>
</body>
这篇关于AngularJS禁用ngClick的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!