I have an ng-repeat that I set different color for each row like below:

ng-style="{'background': colors[$index % colors.length]}

Now I have data that I would like to check: {{obj.dueInHours}} <= 15 -> Set color to yellow and {{obj.dueInHours}} <= 5 -> Set color to red else use the colors[$index]

Is this possible?

Br, Toube

CodePudding user response：

ng-style="{'background': obj.dueInHours <= 15 ? 'yellow' :  obj.dueInHours <= 5 ? 'red' : colors[$index % colors.length]}

If the item is due in 15 hours or less, color yellow. If 5 hours or less, color red. Otherwise, color default color row.

Granted, this is a bit much for the html to deal with. Imagine the request is to have a different color for each hour for 100 hours? You certainly would not have this in the html but rather the controller or directive.

My recommendation is to run the logic once and set to a variable on the scope that way the value is not recalculated with every digest. If you need the values checked periodically then you can either 1. refresh the page 2. use the setTimeout function to recalculate as needed.