Search code examples
angularjsangularjs-scopeng-class

AngularJS - Applying ng-class based on numbers


I understand how to use ng-class for boolean values, e.g:

<div ng-class="{true: 'success', false: 'error'}[IsPositive]">

However, how do i perform based on a numeric value?

For example, if i have a $scope.myNumber, which can be any positive or negative value e.g.

-212

or

-31

or

0

or

31

or

123

How can i use an ng-class to apply 3 types of classes, that is, when:

$scope.myNumber > 0
$scope.myNumber < 0
$scope.myNumber == 0

Solution

  • <div ng-class="{'zero' : myNumber == 0, 
    'negative' : myNumber < 0, 
    'positive' : myNumber > 0}">