Is it possible to skip a particular iteration in ng-repeat without modifying the underlying array/object being iterated over?
Consider the following example:
var steps = [
{
enabled: true
},
{
enabled: true
},
{
enabled: false
}
];
Let's say we want to skip the third step based on the value of its "enabled" key. In a more recent version of Angular, we could achieve this with:
<div data-ng-repeat="step in steps" data-ng-if="step.enabled">
However, in version 1.0.8, ng-if
is not available.
One approach I tried was creating a filter like this:
<div data-ng-repeat="step in steps | isEnabled" data-ng-if="step.enabled">
JS:
filter('isEnabled', function() {
return function(input) {
for(var i = 0; i < input.length; i++) {
if(!input[i]['enabled']) {
input.splice(i, 1);
}
};
return input;
};
})
However, this method alters the original step object, which is not ideal. I then attempted to clone the steps array:
filter('isEnabled', function() {
return function(input) {
var stepsBackup = angular.copy(input);
for(var i = 0; i < stepsBackup.length; i++) {
if(!stepsBackup[i]['enabled']) {
stepsBackup.splice(i, 1);
}
};
return stepsBackup;
};
})
Unfortunately, this resulted in errors:
Error: 10 $digest() iterations reached. Aborting!
...
What could be the missing piece of the puzzle here?