JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.6/angular.min.js"></script>
<div ng-controller="main">
  <table style="width: 100%">
    <thead>
      <tr>
        <th>User</th>
        <th>Date</th>
        <th>Count</th>
      </tr>
    </thead>
    <tbody>
      <tr ng-repeat="row in reports" class="{{row.date | filterDate}}">
        <td style="text-align: center;">{{row.user}}</td>
        <td style="text-align: center;">{{row.date | date:'short'}}</td>
        <td style="text-align: center;">{{row.count}}</td>
      </tr>
    </tbody>
  </table>
</div>

CSS

.even {
  background-color: green;
  color: #fff;
}

.odd {
  background-color: red;
  color: #000;
}

JavaScript

var myApp = angular.module('myApp', []);
myApp.controller('main', function($scope) {
  $scope.reports = [{
    user: 'gaurav',
    date: 1488975476990,
    count: 5
  }, {
    user: 'ashok',
    date: 1488979476990,
    count: 9
  }, {
    user: 'ankit',
    date: 1489756849243,
    count: 6
  }, {
    user: 'ashok',
    date: 1489758783243,
    count: 9
  }, {
    user: 'gaurav',
    date: 1489834476990,
    count: 5
  }, {
    user: 'ankit',
    date: 1489839477990,
    count: 6
  }]
});

myApp.filter('filterDate', function() {
  var lastDate,
    count = 0,
    calssName = 'even';
  return function(date) {
    var newDate = new Date(date).toDateString();
    !lastDate && (lastDate = newDate);
    if (newDate != lastDate) {
      if (calssName == 'even') {
        calssName = 'odd';
      } else {
        calssName = 'even';
      }
    }
    lastDate = newDate;
    return calssName;
  }
});