angularjs - 如何在 Angular js 更改时将类添加/删除到复选框的父元素

Question

我有一个包含复选框项目的列表，在选择复选框时我想向父 li 添加一个类。我怎样才能做到这一点。

我是 Angular 新手。

<ul>
 <li><input type="checkbox" name="fruits[]" value="1">Apple</li>
 <li class="active"><input type="checkbox" name="fruits[]" value="2" checked>Orange</li>
 <li><input type="checkbox" name="fruits[]" value="3">Pear</li>

</ul>

选中复选框后，我想将事件类添加到父 li

Answer 1

你可以用 ng-class 来做到这一点:

<ul>
 <li ng-class="{active: orange}"><input type="checkbox" ng-model="orange" name="fruits[]" value="2" checked>Orange</li>
</ul>

{active: orange} 表示，“如果 orange 为真，则只添加 active 类。”

ng-model 双向绑定(bind)复选框的值。这为您提供了一个变量 orange 以在 Angular 上下文中使用。