AngularJS creates infinite loop when $http request returns error -
my problem pretty simple, i'm not able find out happens.
all want read posts local rest api. when i'm responding http 401 api, angularjs keeps repeating requests in infinite loop.
var request = { method: 'get', url: 'http://jentzschserverdev-46690.onmodulus.net/index.php/issues', headers: { 'anonymous': true } }; $http(request) .success(function(data){ console.log('success', data); deferred.resolve(data.issues); }) .error(function(){ console.log('error'); deferred.resolve([]); });
the console tells me:
error: [$rootscope:infdig] 10 $digest() iterations reached. aborting! watchers fired in last 5 iterations: [] http://errors.angularjs.org/1.3.15/$rootscope/infdig?p0=10&p1=%5b%5d @ angular.js:63 @ scope.$digest (angular.js:14346) @ scope.$apply (angular.js:14571) @ done (angular.js:9698) @ completerequest (angular.js:9888) @ xmlhttprequest.requestloaded (angular.js:9829)(anonymous function) @ angular.js:11655(anonymous function) @ angular.js:8596scope.$apply @ angular.js:14573done @ angular.js:9698completerequest @ angular.js:9888requestloaded @ angular.js:9829 angular.js:63 uncaught error: [$rootscope:infdig] 10 $digest() iterations reached. aborting! watchers fired in last 5 iterations: [] http://errors.angularjs.org/1.3.15/$rootscope/infdig?p0=10&p1=%5b%5d
for better understanding created plunker: http://embed.plnkr.co/r4tyuhei9vkylpgvat5b/ (if uncomment code in app.js, browser should crash due infinite loop)
can tell me what's happening here , why??
an infinite digest occurs in angular when object on scope always changing. can't sure of what's causing without seeing more of code.
not sure if causing problem, current $http.get
not correctly handling errors, i.e. http 401
you need this:
$http.get('http://mylocalapi/posts').then( function(success) { console.log('response', success); }, function(error) { console.log('error', error); });
the then()
method takes 2 arguments, success callback , error callback. read more $http.
update
check out update plunker.
the infinite digest seemed come using function in ngrepeat:
<li class='issue' ng-repeat="issue in loadissues()"> {{issue.name}} </li>
creating array on $scope
, using in ngrepeat fixed that:
<li class='issue' ng-repeat="issue in issuelist"> {{issue.name}} </li>
also, $http
returns promise don't need use $q
. point array on scope resolved data:
$http(request) .success(function(data){ console.log('success : ', data); $scope.issuelist = data; }).error(function(error) { console.log('error : ', error); });
Comments
Post a Comment