javascript - AngularJS: RangeError when recursively calling function with $timeout -

i trying learn angularjs book 'angularjs novice ninja'. (i have programmed before, not javascript.)

one example wants demonstrate events. uses recursive call of function timeout. when try code out, gives rangeerror: maximum call stack size exceeded. works without recursive call. doing wrong?

thanks, pieter

angular.module('myapp.controllers', []);  angular.module('myapp.controllers').controller('messagecontroller', function($scope, $timeout) {   $scope.messages = [{         sender: 'user1',         text: 'message1'   }];   var timer;   var count = 1;   $scope.loadmessages = function() {     ++count;     $scope.messages.push({         sender: 'user1',         text: 'message'+count     }); // line seems cause problem     timer = $timeout($scope.loadmessages(), 2000);     if (count==3) {         $scope.$broadcast('event_no_data', 'not connected');         $timeout.cancel(timer);     }   };   timer = $timeout($scope.loadmessages(), 2000);   $scope.$on('event_received', function(){     console.log('received emitted event event_received in messagecontroller.'); }); 

});

angular.module('myapp.controllers').controller('statuscontroller', function($scope) { $scope.name = 'world'; $scope.status = 'connected'; $scope.statuscolor = 'green'; $scope.$on('event_no_data', function(event, data) {     console.log('received broadcast event event_no_data in statuscontroller.');     $scope.status = data;     $scope.statuscolor = 'red';     $scope.$emit('event_received'); }); 

});

change $scope.loadmessages() $scope.loadmessages.