ng-class-even directive

<!doctype html>

<html>
  <head>
    <link rel="stylesheet" href="lib/style.css">
    <script src="lib/script.js"></script>
  </head>

  <body>
       <div ng-app="myApp1" ng-controller="Employee1Controller" ng-cloak>
        <table>
            <thead>
                <tr>
                    <th>Days</th>
                    <th>Available Time</th>
                </tr>
            </thead>
            <tbody>
                <tr ng-repeat="item in weekData" ng-class-even="'even-row'">
                    <td>{{item.day}}</td>
                    <td>{{item.hours}}</td>
                </tr>
            </tbody>
        </table>
    </div>

  </body>
</html>


import angular from 'angular';

var myapp = angular.module('myApp1', []);
 myapp.controller('Employee1Controller', function ($scope) {
 $scope.weekData = [{ day: "Friday", hours: "5:00pm to 12:00am" },
                    { day: "Wednesday", hours: "5:00pm to 11:00pm" },
                    { day: "Sunday", hours: "11:00am to 11:00pm" },
                    { day: "Thursday", hours: "5:00pm to 11:00pm" },
                    { day: "Saturday", hours: "11:00am to 12:00am" }
                    ];

                });

[ng\:cloak],
[ng-cloak],
[data-ng-cloak],
[x-ng-cloak],
.ng-cloak,
.x-ng-cloak {
    display: none !important;
}

h1,
p {
    font-family: sans-serif;
}
.even-row {
            color: white;
            background-color: grey;
        }

{
  "name": "@plnkr/starter-angularjs",
  "version": "1.0.1",
  "description": "AngularJS starter template",
  "dependencies": {
    "angular": "^1.6.9"
  },
  "plnkr": {
    "runtime": "system",
    "useHotReload": false
  }
}