Angular $timeout within loop fails

Question

I am using angular $timeout as,

 $scope.alltexts = ["hii" , "hello" , "hehe"]
 var sendtime = 60000

 for (var i = 0; i < $scope.alltexts.length; i++) {
   var text = $scope.alltexts[i]
   $setTimeout(function() {}, (function(){$scope.addtext(text)}, sendtime + (i * 60000)));
 };

 $scope.addtext = function(text){
  console.log(text)
 }

But after each one minute it only console "hehe". Means it considers only last value. Please let me know how should I get proper results.

please look at the following if want some explanation http://stackoverflow.com/questions/5226285/settimeout-in-for-loop-does-not-print-consecutive-values?lq=1, http://stackoverflow.com/questions/750486/javascript-closure-inside-loops-simple-practical-example — koox00, Apr 15 '16 at 12:38

score 2 · Accepted Answer · answered Apr 15 '16 at 12:29

Too much of closures today, you are always passing the last index... a closure will create a new scope for each iteration.

 $scope.alltexts = ["hii" , "hello" , "hehe"]
 var sendtime = 60000

 for (var i = 0; i < $scope.alltexts.length; i++) {
   (function(i){
   var text = $scope.alltexts[i]
   $setTimeout(function() {}, (function(){$scope.addtext(text)}, sendtime + (i * 60000)));
   })(i)
 };

 $scope.addtext = function(text){
  console.log(text)
 }

score 1 · Answer 2 · answered Apr 15 '16 at 12:31

Try this

$scope.alltexts = ["hii" , "hello" , "hehe"]
 var sendtime = 60000

 for (var i = 0; i < $scope.alltexts.length; i++) {
   (function(i){
   var text = $scope.alltexts[i]
   $setTimeout(function() {}, (function(){$scope.addtext(text)}, sendtime + (i * 60000)));
   })(i)
 };

 $scope.addtext = function(text){
  console.log(text)
 }

Angular $timeout within loop fails

2 Answers2