Fiddle: BrandonTilley.com: AngularJS Example
AngularJS 1.1.5 Includes jQuery
by limeric29
HTML
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.1.4/angular.min.js"></script>
<table ng-controller="DataController">
<tr>
<th ng-repeat="header in transposed.headers">{{header}}</th>
</tr>
<tr ng-repeat="ary in transposed.values">
<td ng-repeat="item in ary">{{item}}</td>
</tr>
</table>
JavaScript
// http://stackoverflow.com/questions/18327348/angularjs-ng-repeat-in-this-model
app = angular.module('demo', []);
app.value('transpose', function(items) {
var results = { headers: [], values: [] };
angular.forEach(items, function(value, key) {
results.headers.push(key);
angular.forEach(value, function(inner, index) {
results.values[index] = results.values[index] || [];
results.values[index].push(inner);
});
});
return results;
});
app.controller('DataController', function($scope, transpose) {
$scope.items = {
item1: [1, 2, 3, 4, 5],
item2: ['a', 'b', 'c', 'd', 'e'],
item3: ['a1', 'b2', 'c3', 'd4', 'e5']
};
// Re-calculate transposed any time items changes.
$scope.$watch('items', function() {
$scope.transposed = transpose($scope.items);
});
});