AngularJS ng-class multiple condition

without using if,else and ternary operator

by Korah Babu Varghese

HTML

<link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css">
<div ng-app="classApp" ng-controller="appCtrl">
  <table class="table table-bordered">
    <tr>
      <td ng-class="{
        'good': good(),
        'bad': bad(),
        'average': average()       
    }">{{status}}</td>
    </tr>
  </table>

</div>

CSS

.good {
  background: green;
}

.bad {
  background: red;
}

.average {
  background: yellow;
}

JavaScript

var app = angular.module('classApp', []).
controller('appCtrl', function($scope) {

  // status value taken from IED
  var status = 'bad';
  $scope.status=status;
  ////////////////////////////

  //GOOD CONDITION
  $scope.good = function($scope) {
    if (status == 'good')
      return status;
  }

  /////////////////

  //BAD CONDITION
  $scope.bad = function($scope) {
      if (status == 'bad')
        return status;
    }
    ////////////////////

  //AVERAGE OR INTERMEDIATE CONDITION
  $scope.average = function($scope) {
      if (status == 'average')
        return status;
    }
    ///////////////////////

});