Angularjs: Promise doesn't update Binding

Question

I'm using a promise. But when my promise resolves the binding to the view doesn't bind to the new value.

I made a small jsfiddle: http://jsfiddle.net/58q8khap/8/

Here's the view:

<div ng-controller="MyCtrl">
  Hello, {{name}}!
</div>

and the code:

var myApp = angular.module('myApp',[]);

function MyCtrl($scope,ownservice) {
    $scope.name = "Noname";
    ownservice.getname().then(function(result){
        $scope.name = 'Superhero';
    });
}

myApp.service('ownservice', function ($q) {
    this.getname = function () {
        var deferred = $q.defer();
        setTimeout(function() {
                deferred.resolve('Superhero');
        } , 1000);
        return deferred.promise;
        }
});

Jscti · Accepted Answer · 2014-10-02 08:26:58Z

2

Just replace the use of setTimeout by the angular version $timeout. That way angular will force a digest cycle and refresh your scope

Working fiddle : http://jsfiddle.net/cunuj46w/

Note that you should really use angular-powered versions of globals like $timeout or $window also for testing/mocking purposes

answered Oct 2, 2014 at 8:26

Jscti

14.5k5 gold badges66 silver badges92 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Steffen Schindler Over a year ago

Ah my problem is another one. And this was a simple sample. But due your answer I discovered that. Thanks

Steffen Schindler Over a year ago

It's ok. I think it was a typo or something like that

A.B · Accepted Answer · 2014-10-02 08:26:47Z

1

after this line

 $scope.name = 'Superhero';

add

$scope.$apply();

answered Oct 2, 2014 at 8:26

A.B

20.5k3 gold badges43 silver badges74 bronze badges

Collectives™ on Stack Overflow

Angularjs: Promise doesn't update Binding

2 Answers 2

2 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

2 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related