Erick
Erick

Reputation: 250

Choose class by current date in angularjs

I have a icon, and i need to change its color if modified date is = current date.

logic: if inventory.modified = time then apply style.

in controller :

$scope.time = new Date();

Template: <span class="glyphicon glyphicon-ok-sign" ng-class=""></span>

api modified: modified: "2014-04-07T13:04:25.676000",

Upvotes: 0

Views: 71

Answers (1)

Im0rtality
Im0rtality

Reputation: 3533

You need to change logic a little bit.

Looking at timestamp format, style would be applied for only 1/100000th of a second. I think chance to get javascript running at that EXACT time is pretty low.

You probably want one of following:

  1. Apply style if it is same minute

  2. Apply style if time matches and remove it after specified interval (say, 15 seconds)

Either way, date filter should be usefull: http://docs.angularjs.org/api/ng/filter/date

EDIT:

in JS:

// do this once, so we don't need convert again    
$scope.time = $filter('date')(new Date(), 'shortDate');

...
inventory.$modified = $filter('date')(new Date(inventory.modified), 'shortDate');

in template:

<span ng-class="active: inventory.$modified == time"> {{ inventory }} </span>

Although, for performance I would precalculate field inventory.$modifiedToday (=true/false) so each iteration would not need to recalculate. Template would be like this:

<span ng-class="active: inventory.$modifiedToday"> {{ inventory }} </span>

Upvotes: 1

Related Questions