Update $scope from inside callback in angularJS

Question

I have this controller and I would like to update the $scope.progress from within the function callback. I tried using $rootScope and $scope.apply() but I can't get it to work. Is there something I'm missing?

progressupdate is a variable returned by the event. the code is not exactly like this. I made it super simple here to show the structure.

app.controller('player', function($scope) {
 var show = function(url) {
 function(err, showOK) {
 if (err) {
 console.log(err);
 } else {
 showOK.on('listening', function(){
 $scope.progress = progressupdate;
 });
 }
 });
 }
 show(url);
});

Am I running that function incorrectly inside the controller? Should I use something like this?

 $scope.show = function(url)...etc

• SomeKittens: Your example is syntactically incorrect. Not sure if that's a bad copy/paste or the actual problem.
• fmtoffolo: oops, some bad copypasta.

Answer 1

I don't see the $apply function on above script, and progressupdate. Try $apply after set, or set it inside $apply :

showOk.on('listening', function(){
 $scope.$apply(function(){
 $scope.progress = progressupdate;
 });
});

or

showOk.on('listening', function(){
 $scope.progress = progressupdate;
 $scope.$apply();
});

The first method is recommended.

• fmtoffolo: I guess I'm pretty burned out cause I tried what you suggested before and couldn't get it to work! thanks!