Possible Duplicate:
angularjs - promise never resolved in controller
I'm wrapping a slow WebSockets server in a AngularJS service, and then calling into that service from my controllers. If I chain callbacks onto callbacks onto callbacks, everything works just fine, any the UI updates asynchronously.
When I try to use $q.defer()
to clean up that mess of callbacks, it seems my deferred never gets called. I'm familiar with the concepts of deferred from Python's Twisted, so I think conceptually everything should work - but it doesn't.
This is the shortest example I could come up with, the slow WebSockets server is simulated with a setTimeout function.
<!doctype html>
<html ng-app="beta">
<head>
<title>Beta</title>
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.0.4/angular.min.js"></script>
<script>
var beta = angular.module('beta', []);
var BetaCtrl = function ($scope, betaServ) {
$scope.button = function () {
serv_result = betaServ.slow();
console.log(serv_result);
serv_result.then(function (result) {
console.log('callback finished');
});
}
}
beta.service('betaServ', function($q) {
this.slow = function () {
d = $q.defer()
setTimeout(function () {
console.log('before resolve');
d.resolve();
console.log('after resolve');
}, 2000);
return d.promise;
}
});
</script>
</head>
<body>
<div ng-controller="BetaCtrl">
<button ng-click="button()">Run</button>
</div>
</body>
</html>
The could should run as following:
- button click
- $scope.button() gets called; it calls the service.slow() function
- service.slow() returns a deferred
- a callback is registered on the deferred
- deferred fires, triggering the registered callback (this part never happens)
Any ideas? Thanks.
setTimeout
to$timeout
, and it seems to work! I still don't get it, since I'm not updating the UI, just logging to console. And, it still doesn't help in my case, since the delay in the original code is not because of a setTimeout, but because of a WebSockets request.