<link href="http://www.example.com/wp/wp-content/themes/ang/css/ng-grid.min.css" rel="stylesheet">
<link href="http://www.example.com/wp/wp-content/themes/ang/css/grid1.css" rel="stylesheet">
<script type='text/javascript' src='http://www.example.com/wp/wp-content/themes/ang/js/ng-grid.min.js'></script>
<script type='text/javascript' src='http://www.example.com/wp/wp-content/themes/ang/js/grid1.js'></script>
<div ng-controller="MyCtrl">
  <div class="row">
    <div class="col-sm-12">
      <div class="gridStyle" ng-grid="gridOptions">
      </div>
    </div>
  </div>
</div>

var myApp = angular.module('googleMapApp', ['ui.bootstrap','ngGrid']);

myApp.controller('MyCtrl', function($scope) {
    var myData = [
      {name: "product-A", day: "2014/08/12", count: 50},
      {name: "product-B", day: "2014/08/12", count: 43},
      {name: "product-A", day: "2014/09/11", count: 27},
      {name: "product-B", day: "2014/07/23", count: 29},
      {name: "product-C", day: "2014/03/03", count: 34},
      {name: "product-D", day: "2014/08/12", count: 50},
      {name: "product-E", day: "2014/08/12", count: 43},
      {name: "product-F", day: "2014/09/11", count: 27},
      {name: "product-G", day: "2014/07/23", count: 29},
      {name: "product-H", day: "2014/03/03", count: 34},
      {name: "product-R", day: "2014/03/03", count: 34}
    ];
    $scope.pagingOptions = {
      pageSizes: [3, 5, 8],
      pageSize: 3,
      currentPage: 1
    };
    $scope.totalServerItems = myData.length;
    $scope.setPagingData = function(pageSize,page){
      $scope.pagedData = myData.slice((page - 1) * pageSize, page * pageSize);
      if (!$scope.$$phase) {
        $scope.$apply();
      }
    };

    $scope.setPagingData($scope.pagingOptions.pageSize, $scope.pagingOptions.cur
rentPage);

    $scope.$watch('pagingOptions', function (newVal, oldVal) {
      if (newVal !== oldVal && newVal.currentPage !== oldVal.currentPage) {
        $scope.setPagingData($scope.pagingOptions.pageSize, $scope.pagingOptions
.currentPage);
      }
    }, true);

    $scope.gridOptions = {
      data: 'pagedData',
      enablePaging: true,
      showFooter: true,
      totalServerItems: 'totalServerItems',
      pagingOptions: $scope.pagingOptions
    };

});