javascript - Change CSS property of element when time changes -

i'm building toy job scheduling system using meteor.

here's controller pass "shifts" collection:

angular.module('eamorr').controller('eamorrctrl', ['$scope', '$meteor', function ($scope, $meteor) {     $scope.shifts = $meteor.collection(shifts);     ... }]); 

... .ng.html:

<tr ng-repeat="shift in shifts">    ...    <td>{{shift.unixtime_start*1000 | date:'yyyy-mm-dd'}}</td>     ... </tr> 

now, when shift.unixtime_start less current time, want whole row have background-color:orange , when shift.unixtime_start greater current time, want whole row have background-color:green.

can give me tip how neatly, cleanly , concisely?

i've been looking @ doing load of ng-if statements, etc. have use interval? check every 5 seconds , update table accordingly? doesn't seem right way me...

not necessarily.

template.shifts.oncreated(function () {   this.now = new reactivevar(moment());   this.timerid = null;    let onesecond = moment().add(1, 'minute').startof('minute');   meteor.settimeout(() => {     this.timerid = meteor.setinterval(() => {       this.now.set(moment());     }, 5000)   }, onesecond.get('milliseconds')); });  template.shifts.helpers({   timecolor: function (unix) {     let time = moment(unix);     if (moment.isbefore(time, this.now.get())) {       return '#ff00ff';     } else if (moment.isafter(time, this.now.get())) {       return '#ff0000';     } else {       return '#003366';     }   } });  template.shifts.ondestroyed(function () {   meteor.clearinterval(this.timerid); }) 

then in template

<tr style="background-color: {{ timecolor shift.unixtime_start }};">   <td>{{ shift.unixtime_start }}</td> </tr>