CODEWITHSUNDEEP
javascriptangularjs
neptune
neptune

Reputation: 1261

Function executed more times than expected

Here's a short Angular app:

angular.module('AppName', [])
.controller('TwoController', function($scope){
var oneArray = ['1','2'];
$scope.secondArray = [];
for (i in oneArray){
  $scope.secondArray.push({
    property: function(){
      console.log('1');
      return 'word';
    }
  })
}
});

In the view I have:

<div ng-app="AppName" ng-controller="TwoController">
<p ng-repeat='entry in secondArray'>{{entry.property()}}</p>
</div>

The example on jsfiddle.

It correctly displays the string word two times, but when I check the console, it shows function executed 4 times (via console.log('1')). Any idea on why?

Upvotes: 4

Views: 218

Answers (2)

Walfrat
Walfrat

Reputation: 5353

This is because for..in loops on properties and Array have the property length too and another one that make it loop another time. IUf you want to see it just do console.log(i)

Either use a angular.forEach or the old for(var i = 0; i < ...)

EDIT : failed answer : The reason is because of angular.

He will go through the list twice : once at init and once at the end of his loop to check for changes

Upvotes: 2

Josef Fazekas
Josef Fazekas

Reputation: 477

Seems like the view just gets rendered twice, so i don't think you have a real problem...

Upvotes: 0

Related Questions