Search code examples
angularjsglyphicons

angularjs apply one class by ternary and another always

I want to have the 'glyphicon' class on my icon tag always. I want to have the 'glyphicon-plus' class when item.expanded is false, 'glyphicon-minus' class when item.expanded is true.

It seems there would be a simple way to do this but I've been unsuccessful using the ternary operator when I need another class to always be there. The following code does not work.

<i ng-class="'glyphicon', (item.expanded) ? 'glyphicon-minus' : 'glyphicon-plus'"></i>
Solution

  • ng-class don't really behave like this.

    google says : What is the best way to conditionally apply a class?

    so an answer for your question could be :

    <i class="glyphicon" ng-class="{'glyphicon-minus' : item.expanded, 'glyphicon-plus' : !item.expanded}"></i>