Snippet for SO question

http://stackoverflow.com/questions/34913769/angularjs-ng-repeat-column-aware-table/34914035#34914035

by Viktor Evdokimov

HTML

<div ng-app='myApp' ng-controller='myCtrl'>
  <table>
  <tr>
  <th>time range</th>
  <th ng-repeat='c in categories'>{{ c }} </th>
  <th>no category</th>
</tr>

<tr  ng-repeat='(k,v) in grouped'>
  <th>{{ k }} : 00 - {{ k >22 ? 0 : 1 + +k }}: 00</th>
  <td ng-repeat='c in categories'>{{ v[c] }} </td>
  <td>{{ v['no category'] }}</td>
</tr>
</table>
<pre>
{{ grouped | json  }}
</pre>
</div>

CSS

table { border-collapse: collapse; }
table tr td { border: 1px solid black;padding:5px; }
table tr th { border: 1px solid black;padding:5px; }

JavaScript

var myApp = angular.module('myApp', [])

myCtrl.$inject = ['$scope']

myApp.controller('myCtrl', myCtrl)

function myCtrl($scope) {
    var list = [
       { data: 'a', schedule: new Date(), category: 'category a' },
       { data: 'b', schedule: new Date(), category: 'category b' },
       { data: 'c', schedule: new Date(), category: 'category c' },
       { data: '0', schedule: new Date(),  },
       { data: 'a', schedule: new Date(), category: 'category a' },
    ]

    var categories = $scope.categories = ['category a', 'category b', 'category c']

      $scope.grouped = list.reduce(function(a, d) {
      var hours = d.schedule.getHours();

      if (!(hours in a)) a[hours] = {}

      var timeSlot = a[hours]

      timeSlot[d.category || 'no category' ]  = 
          1 + ( timeSlot[d.category || 'no category'] | 0)

      return a;
  }, {})

}