Currently, I have an ng-repeat
in place, looping through an array of objects that are associated with the SomeController
:
<div ng-controller="SomeController as aCtrl">
<div ng-repeat="category in aCtrl.categories">
<p ng-show="aCtrl.checkShouldBeDisplayed(category)">{{category.name}}</p>
</div>
</div>
The controller has been defined like so:
app.controller('SomeController', function() {
this.categories = [{
"name": "one",
}, {
"name": "two",
}, {
"name": "three",
}, {
"name": "four",
}];
this.counter = 0;
this.checkShouldBeDisplayed = function(channel) {
this.counter = this.counter + 1;
console.log("Executing checkShouldBeDisplayed " + this.counter);
return true;
};
});
It was expected that the checkShouldBeDisplayed
function would count up to 4 due to the four elements present in the SomeController.categories
array. However, it is counting up to 8 instead – you can view this behavior here: http://plnkr.co/edit/dyvM49kLLTGof9O92jGb (please refer to your browser console for the logs). How can I resolve this issue? Thank you!