Link to JSFiddle: http://jsfiddle.net/WdVDh/101/.
When updating the sorting option for an ng-repeat list, I noticed that the array length changes and in my local version, all items disappear.
My code involves filtering and sorting, with the ability to filter out employees with a completed 'leaveDate' property using a checkbox linked to a 'showLeavers' $filter directive.
In my local version, when the checkbox is unchecked and the second or third sorting option is chosen, the array gets cleared and nothing shows up in the ng-repeat list. However, when the checkbox is checked or the first or fourth sorting options are used, the list displays correctly.
There seems to be a problem in the code, possibly in the filter directive, as I can replicate a similar issue as shown in the JSFiddle link above.
HTML:
<md-list-item ng-repeat="employee in employees | orderBy: sortEmployees | filter: searchEmployees | showLeavers:showLeaver">
<md-input-container class="col-xs-12 col-sm-6 col-md-3">
<label>Sort by</label>
<md-select ng-model="allEmployees.sortEmployees">
<md-option selected value="surname">Surname - A to Z</md-option>
<md-option value="-surname">Surname - Z to A</md-option>
<md-option value="forename">Forename - A to Z</md-option>
<md-option value="-forename">Forename - Z to A</md-option>
</md-select>
</md-input-container>
<md-checkbox ng-model="showLeaver">Show Leavers?</md-checkbox>
Filter:
app.filter('showLeavers', function() {
return function (employees, showLeaver) {
var matches = [];
angular.forEach(employees, function(value) {
matches.push(value);
if (value.leaveDate && !showLeaver) {
matches.splice(value);
}
return matches;
}
})