How to add/remove a class to the parent element of a checkbox on change in Angular js

Question

I have a list with checkbox items in it, On selecting the checkbox I want to add a class to the parent li. How can I achieve this.

I am new to Angular.

Answer 1

You can do this with ng-class:

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

The {active: orange} is saying, "only add the active class if orange is truthy."

ng-model two-way binds the value of the checkbox. This gives you a variable orange to use inside the angular context.