Angular JS : $Scope.Apply()

Question

I want to know more about $scope.apply() in real time usage. How many times can we use $scope.apply() in a controller?

For example, I have some events like ng-click() , ng-change(), ng-blur() etc. All events are in the same controller. For each and every event, should i use $scope.apply()? If yes, I am getting error :

Error: [$rootScope:inprog] [http://errors.angularjs.org/1.2.15/$rootScope/inprog?p0=%24apply][1]
at Error (native)

I have read in this forum that removing the addition $scope.apply() will resolve the issue.

angularjs $scope.$apply() gives this error: Error: [$rootScope:inprog]

I implemented the same solution of removing multiple $scope.apply() from the code. The errror is gone, but I want to know how and why?

Can anyone please explain.

Thanks in advance.

tophallen · Accepted Answer · 2015-02-24 06:40:34Z

5

$scope.apply() is a trigger to update the DOM, and in most cases (such as a trigger from the DOM like ng-click the evaluation of the trigger is wrapped in a $scope.apply() as it is passed to your controller. You generally don't need to call $scope.apply() as it is already being handled, but if you are having issues with something not updating correctly, you can use $scope.apply() to basically nudge it to update. In order to prevent calling apply when apply is already being evaluated you can do a safe check like so:

if (!$scope.$$phase)
    $scope.apply();

The $$phase is an angular internal property that is null/undefined when no scope apply is in progress, and has a value when a $scope.apply() is executing.

$scope.apply() works by finding the most child scope (the innermost scope) and checking for changes, calling watches, etc, then it crawls up the scopes until it gets to the root scope, so as you might imagine it is a rather heavy call and should be avoided when possible.

answered Feb 24, 2015 at 6:40

tophallen

1,0638 silver badges12 bronze badges

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

1 Comment

Srivathsa Harish Venkataramana Over a year ago

$scope.$digest() is light weight

Collectives™ on Stack Overflow

Angular JS : $Scope.Apply()

1 Answer 1

1 Comment

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Linked

Related