Angularjs Apply scope change to view immediately

Question

How can i make angular apply the changes to the view before exiting the click method? In the following example i want the span to be visible while the confirm box is shown.

$scope.click = function () {
    $scope.saving = true; //Not enough

    $scope.$apply(function () {
        $scope.saving = true;
    });//Throws error but works [$rootScope:inprog] $apply already in progress 
    confirm('Are you sure?');

    $scope.saving = false;
}


<span ng-show="saving">Loading ... </span>

Plunker

Pieter Herroelen · Accepted Answer · 2014-04-07 12:06:02Z

7

What you want to do is doing part of your code in one digest cycle of Angular and the rest in another. I accomplish this by using a small timeout:

$scope.click = function () {
    $scope.saving = true;

    $timeout(function() {
        confirm('Are you sure?');
        $scope.saving = false;
    }, 50);
}

NB: Don't forget to add $timeout to the dependencies of your controller

answered Apr 7, 2014 at 12:06

Pieter Herroelen

6,0862 gold badges33 silver badges37 bronze badges

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

Collectives™ on Stack Overflow

Angularjs Apply scope change to view immediately

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related