Angular filter grouping

Example demonstrating how to perform group filtering using Angular filters.

HTML

<div ng-app ng-controller="Main">
  <ul ng-repeat="group in recordsToFilter() | filter:filterRecords">
    <b>{{group.date}}</b>
    <li ng-repeat="record in records | filter:{date: group.date}">{{record.time}}: {{record.message}}</li>
  </ul>
</div>

CSS

li {
  margin-left: 1em;
}

JavaScript

function Main($scope) {
  $scope.records = [{
    date: "01/01/2001",
    time: "03:28 AM",
    message: "message strings here."
  }, {
    date: "01/01/2001",
    time: "04:28 AM",
    message: "message strings here."
  }, {
    date: "01/01/2001",
    time: "06:28 AM",
    message: "message strings here."
  }, {
    date: "01/01/2002",
    time: "04:28 AM",
    message: "message strings here."
  }, {
    date: "01/01/2002",
    time: "05:28 AM",
    message: "message strings here."
  }];

  var indexedRecords = [];

  $scope.recordsToFilter = function() {
    indexedRecords = [];
    return $scope.records;
  }

  $scope.filterRecords = function(record) {
    var recordIsNew = indexedRecords.indexOf(record.date) == -1;
    if (recordIsNew) {
      indexedRecords.push(record.date);
    }
    return recordIsNew;
  }
}