Question

使用AngularJS标记点击元素是否有一种简单的声明方式（在$ scope中没有附加函数）？

e.g。我有一个按钮，我想标记为点击/选中。

<button ng-model="form.btn" ng-click=" // do stuff here to add a class or attr ">Go</button>

我能够通过外部函数实现这一点，但我正在寻找HTML模板中的声明方式/全部。

Answer 1

如果您想切换课程，请使用以下代码：http://jsbin.com/vimero/1/edit

<button ng-model="btn" ng-click="btn =! btn" ng-class="{'active' : btn}"> 
 Toogle 
</button>

Answer 2

<button ng-model="form.btn" ng-click="form.btn = true" 
ng-class="{'active' : form.btn}">
    Go
</button>

Answer 3

ng-click="yourFunction($event.target)"

在yourFunction中进行转换。你将HTMLElement作为第一个参数传递。

Answer 4

如果满足 ng-click 中设置的条件，我发现这对于一组用于切换活动 ng-class 的按钮非常有效：

<button ng-class="{'active' : activeButton == 'firstButton'} ng-click="activeButton = 'firstButton'>
  First Button
</button>
<button ng-class="{'active' : activeButton == 'secondButton'} ng-click="activeButton = 'secondButton'>
  Second Button
</button>
<button ng-class="{'active' : activeButton == 'thirdButton'} ng-click="activeButton = 'thirdButton'>
  Third Button
</button>

AngularJS - 单击后将活动类添加到自身

4 个答案: