AngularJS - orderBy in Ctrl
by bryangrimes
HTML
<div ng-controller="MyCtrl">
there are {{logs.length}} time records:
<ul>
<li ng-repeat="proj in logs">
{{proj.project}} has a total of {{proj.hours}} hours for a cost of {{proj.cost}}
<div ng-repeat="log in proj.sortedLogs">
<ng-switch on="$first || log.dept!= sortedLogs[$index-1].dept">
<div ng-switch-when="true" class="group">Group of {{log.dept}} users. Previous: <i>{{sortedLogs[$index-1].dept}}</i></div>
</ng-switch>
<b>[{{$index + 1}}]</b> {{log.name}} worked {{log.hours}} hours.
</div>
</li>
</ul>
</div>
CSS
body { margin: 4px }
.group { margin-top: 1em; border-bottom: 1px solid #CCC; }
/*.ng-scope { margin: 4px; border: 1px dashed red; }*/
JavaScript
function MyCtrl($scope, orderByFilter) {
$scope.logs= {cost: 999.50, hours: 29.50, project: "XXX", worklogs: [{name:'bgrimes', hours:10, dept:'app'}, {name:'aallen', hours:18, dept:'ext app'}, {name:'pmolnar', hours:8, dept:'db'}, {name:'dgelling', hours:9, dept:'db'}, {name:'yshevets', hours:5, dept:'ext db'}, {name:'plahm', hours:10, dept:'qa'}, {name:'kingert', hours:20, dept:'pm'}, {name:'jchoi', hours:2, dept:'ext qa'}, {name:'jdennis', hours:10, dept:'app'}, {name:'mpeters', hours:3, dept:'qa'}]};
$scope.sortedLogs = orderByFilter($scope.logs, '+dept');
}