Error: $digest already in progress in angularjs when using alert

Question

I am just getting the json data from the services in the controller.

And I am using a callback function to print the success message when it got loaded. It is working fine but it is also throwing an error which I mentioned in the question

//JSON file
{
"pc":"name"
}

// angular services
var service = angular.module('Services', ['ngResource']).
factory('Widgets', function($resource){
    return $resource('/json/home.json', {}, {
        query: {method:'GET', params:{}, isArray:false}
    });
});

//controller
function editWidget($scope, Widgets) {
 $scope.data = Widgets.query(function(data) {   
    alert("Success Data Loaded ---> " + JSON.stringify(data.pc));
 });
}

There is nothing wrong with this code - your problem must lie elsewhere. You usually get this error message when you do a `$scope.$apply(...)` — joakimbl, May 03 '13 at 05:47
Is the alert failing? How about using a console.log to see the value of the json if the alert gives you problem? — BoxerBucks, May 03 '13 at 18:51
@BoxerBucks yes when i am using console.log it is not throwing the error. but i just wanted to know the cause of the error. — JSAddict, May 04 '13 at 04:45
Here is the working proof of no bug in your code: http://plnkr.co/edit/YDsjQIkBj9JtTZn3V4qX?p=preview — Tosh, May 13 '13 at 08:59
possible duplicate of [Error: $digest already in progress](http://stackoverflow.com/questions/14838184/error-digest-already-in-progress) — TheHippo, May 17 '13 at 14:38
you can use this link [error $digest] for i worked perfect [error $digest]:http://stackoverflow.com/questions/14838184/error-digest-already-in-progress — Alireza Davoodi, Jun 16 '13 at 06:15
You can refer to this post: http://www.boynux.com/angularjs-apply-explained/ I tried to explain $digest in progress very simple. — Boynux, Feb 15 '14 at 14:32

score 12 · Answer 1 · answered Aug 21 '13 at 02:19

12

alert, as well as confirm and prompt will pause the execution of code (blocks the thread), during which timeouts and intervals go all haywire if they should have been triggered during the pause. The $digest loop is made up of two smaller loops, which process $evalAsync queue and the $watch list. The $evalAsync queue is used to schedule work which needs to occur outside of current stack frame, but before the browser's view render. This is usually done with setTimeout(0). Your alert during this time causes the problem.

answered Aug 21 '13 at 02:19

TheSharpieOne

25,646
9
66
78

This is definitely the problem but is there a solution beyond not using alert? – RAC Oct 15 '14 at 20:05
Use non-blocking alerts (modals). you can even override window.alert to call your modal. You can also style the modal alerts and can look better than native alerts. – TheSharpieOne Oct 15 '14 at 22:39

score 10 · Answer 2 · edited Mar 11 '17 at 09:41

10

You can use $timeout to execute an alert after the digest cycle is done and this way avoids this error.

$timeout(function () {
    alert('Alert text');
 });

Also don't forget to inject $timeout into your directive

edited Mar 11 '17 at 09:41

K Scandrett

16,390
4
40
65

answered Nov 18 '14 at 19:29

tylik

1,018
1
11
21

score 0 · Answer 3 · answered Feb 22 '17 at 08:46

0

if(!confirm('Your message')){
  return false;
}else {
  return false;
}

Return false in both cases.

answered Feb 22 '17 at 08:46

Love-Kesh

777
7
17

Hui Tan · Answer 4 · 2017-03-29T16:31:53.687

-2

@TheSharpieOne is right, It's work for me.

function delayalert(messagestr){
           setTimeout(function(){
                alert(messagestr);
            },0);
}

edited Mar 29 '17 at 16:31

answered Mar 11 '17 at 09:28

Hui Tan

95
1
5

Error: $digest already in progress in angularjs when using alert

4 Answers4

Linked