AngularJS禁用ngClick

时间:2018-08-14 16:21:41

标签: angularjs angularjs-ng-click

在AngularJS中,有什么方法可以使ng-click依赖于布尔值?

例如,我希望以下文本(“点击”)是可点击的,但当某些范围属性(例如$rootScope.enableClick)为true时,则只能点击

<div ng-click="count = count + 1" ng-init="count=0">Click</div>

最好是有一种不创建自定义指令的简单方法吗?

3 个答案:

答案 0 :(得分:2)

检查一下,我使用了与@georgeawg相同的方法。区别在于,我将其设置为按钮格式并使用了pointer-events: none,因此不会从.clickable

触发点击事件

.clickable {
  cursor: pointer;
  display: inline-block;
  width: 200px;
  text-align: center;
  padding: 10px;
  background-color: #eee;
  transition: all 0.3s ease;
  margin: 10px 0;
}
.clickable:hover {
  background-color: #ddd;
}
.test {
  color: grey;
  pointer-events: none;
}
<script src="//unpkg.com/angular/angular.js"></script>
<body ng-app ng-init="count=0">
  <div>Count={{count}}</div>
   <div ng-click="count = count + 1" ng-class="{'test': stop}" class="clickable">Click Me</div>
   
   <div>
   <input type="checkbox" ng-model="stop">Stop counting
   </div>
</body>

答案 1 :(得分:1)

True表达式中使用奇怪而精彩的&& logical operator

import xlsxwriter

wb = xlsxwriter.Workbook('Wrap.xlsx')

ws = wb.add_worksheet('Test1')

wrap = wb.add_format({'text_wrap': True})

ws.write('A1', '=HYPERLINK("#Sheet1!A1", "A really long name here that does not wrap")', wrap)
ws.write('B1', 'Bye')

wb.add_worksheet('Sheet1')
wb.close()

演示

ng-click
<div ng-click="!stop && (count = count + 1)">Click me</div>


更新

或使用带有ng-disabled指令的按钮

.clickable {
   cursor: pointer; 
}

ng-disabled指令不适用于<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>元素。 <button ng-click="count = count + 1" ng-disabled="stop" >Click Me</button> 属性不是global attribute<div>指令仅适用于disabledng-disabled<input><button>元素,因为这些元素支持disabled property

演示

<textarea>

答案 2 :(得分:0)

尝试

<div ng-click="count = count + 1" ng-init="count=0" ng-disabled="!enableClick">Click</div>
  

ng-disabled指令设置表单字段的disabled属性   (输入,选择或文本区域)。