Newbe Dev Stack

Answer : Try this. <a href="" ng-click="addFavorite(myfav.id);favorite=!favorite"> <i class="fa orange" ng-class="{'fa-star': favorite || fav==myfav.id, 'fa-star-o': !favorite}"></i> No need the brackets. Once you have to add some logic behind ng-class it's always better to stick to using the controller to do that. You can do it two of either ways: JSON syntax (same as in your HTML, just more readable) or obviously JavaScript. HTML (JSON) Syntax HTML <i ng-class="getFavClassIcon(myFav.id)"></i> JS $scope.getFavClassIcon= function (favId) { return { 'fa-star-o' : !$scope.favorite, 'fa-star' : $scope.favorite || $scope.fav === favId }; }; Good Old IF-statement (JavaScript) HTML <i ng-class="getFavClassIcon(myFav.id)"></i> JS $scope.getFavClassIcon= function (favId) { if (!$scope.favori...

Answer : Use nested inline if-then statements ( Ternary Operators ) <div ng-class=" ... ? 'class-1' : ( ... ? 'class-2' : 'class-3')"> for example : <div ng-class="apt.name.length >= 15 ? 'col-md-12' : (apt.name.length >= 10 ? 'col-md-6' : 'col-md-4')"> ... </div> And make sure it's readable by your colleagues :) you could try by using a function like that : <div ng-class='whatClassIsIt(call.State)'> Then put your logic in the function itself : $scope.whatClassIsIt= function(someValue){ if(someValue=="first") return "ClassA" else if(someValue=="second") return "ClassB"; else return "ClassC"; } I made a fiddle with an example : http://jsfiddle.net/DotDotDot/nMk6M/ I had a situation where I needed two 'if' statements that could both go true and an ...