Skip to content Skip to sidebar Skip to footer

Use A Function In Ng-class In Angular Js

I am using ng-class for adding the CSS classes. Even though there are lots articles on this, I am not able to add a function call with ng-class. I have a following expression. n

Solution 1:

You need an array of classes, where one element of an array can be an object of classes with conditions and the other is your function call. A simple example would be:

ng-class="[{'some_class' : condition}, function_class()]"

Here is a demo:

var app = angular.module('myApp', []);
app.controller('myCtrl', function($scope) {
  $scope.bb = function() {
    return "b";
  }
});
.a {
  color: #999999;
}

.b {
  background-color: #F1F1F1;
}

.c {
  font-size: 30px;
}
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.9/angular.min.js"></script>
<div ng-app="myApp" ng-controller="myCtrl">

  <br><input type="checkbox" ng-model="aa" /> A: color : #999999
  <br><input type="checkbox" ng-model="cc" /> C: font-size : 30px

  <div ng-class="[ bb(), {'a':aa, 'c':cc} ]">
    <p>Testing classes</p>
  </div>

</div>

For your example I think you need:

ng-class="[{'highlighter-row-Class' : (file.id == 1 && file.processed) 
        ,'bold-row-Class' : lastSelectedResumeId == file.attributes.name, 
       'failed-doc': !file.processed}, getclass()]"

Post a Comment for "Use A Function In Ng-class In Angular Js"