Change icon for expand collapse in angularjs

Question

I am trying to change icon (ie plus, minus) on click in expand collapse accordion, I am using Font Awesome class for icons. I know it is easily possible with jquery but if there is any way in angularjs, then please let me know.

HTML looks like:

<a class="accordion-toggle" data-toggle="collapse" href="#collapseOne{{test}}">
  Test
</a> 

Answer 1

You should be looking at ng-class .

Short example...

in your template:

<span ng-click="flag = !flag" ng-class="{ active : flag }">
  click me!
</span>

in your css:

.active { color: red; }