0

I am trying to add some angular.js stuff in a normal django form (I am actually using django-crispy-forms). I am submitting the form normally through a POST request and not using angular (I am just using angular for some controls I need on that form).

The form is actually working when it is submitted without errors: It is posted normally and I am redirected to the success page. However, if there are errors in the form (f.e missing fields) I am getting a flash of the response (I see which fields are missing with {{ form.errors }} but after some time (<1 second) I am getting the following output in console:

Error: [$rootScope:infdig] 10 $digest() iterations reached. Aborting!
Watchers fired in the last 5 iterations: []
http://errors.angularjs.org/1.3.0/$rootScope/infdig?p0=10&p1=%5B%5D
    at REGEX_STRING_REGEXP (http://ajax.googleapis.com/ajax/libs/angularjs/1.3.0/angular.js:80:12)
    at Scope.$get.Scope.$digest (http://ajax.googleapis.com/ajax/libs/angularjs/1.3.0/angular.js:14003:19)
    at Scope.$get.Scope.$apply (http://ajax.googleapis.com/ajax/libs/angularjs/1.3.0/angular.js:14227:24)
    at bootstrapApply (http://ajax.googleapis.com/ajax/libs/angularjs/1.3.0/angular.js:1487:15)
    at Object.invoke (http://ajax.googleapis.com/ajax/libs/angularjs/1.3.0/angular.js:4152:17)
    at doBootstrap (http://ajax.googleapis.com/ajax/libs/angularjs/1.3.0/angular.js:1485:14)
    at bootstrap (http://ajax.googleapis.com/ajax/libs/angularjs/1.3.0/angular.js:1505:12)
    at angularInit (http://ajax.googleapis.com/ajax/libs/angularjs/1.3.0/angular.js:1399:5)
    at HTMLDocument. (http://ajax.googleapis.com/ajax/libs/angularjs/1.3.0/angular.js:25579:5)
    at m.Callbacks.j (http://127.0.0.1:8115/static_lcs/jquery-1.11.1.min.js:2:27244) angular.js:11358
Uncaught Error: [$rootScope:infdig] 10 $digest() iterations reached. Aborting!
Watchers fired in the last 5 iterations: []
http://errors.angularjs.org/1.3.0/$rootScope/infdig?p0=10&p1=%5B%5D angular.js:80
Error: [$rootScope:infdig] 10 $digest() iterations reached. Aborting!
Watchers fired in the last 5 iterations: []
http://errors.angularjs.org/1.3.0/$rootScope/infdig?p0=10&p1=%5B%5D
    at REGEX_STRING_REGEXP (http://ajax.googleapis.com/ajax/libs/angularjs/1.3.0/angular.js:80:12)
    at Scope.$get.Scope.$digest (http://ajax.googleapis.com/ajax/libs/angularjs/1.3.0/angular.js:14003:19)
    at Scope.$get.Scope.$apply (http://ajax.googleapis.com/ajax/libs/angularjs/1.3.0/angular.js:14227:24)
    at done (http://ajax.googleapis.com/ajax/libs/angularjs/1.3.0/angular.js:9493:47)
    at completeRequest (http://ajax.googleapis.com/ajax/libs/angularjs/1.3.0/angular.js:9678:7)
    at XMLHttpRequest.requestLoaded (http://ajax.googleapis.com/ajax/libs/angularjs/1.3.0/angular.js:9621:9) angular.js:11358
Uncaught Error: [$rootScope:infdig] 10 $digest() iterations reached. Aborting!
Watchers fired in the last 5 iterations: []
http://errors.angularjs.org/1.3.0/$rootScope/infdig?p0=10&p1=%5B%5D angular.js:80
Error: [$rootScope:infdig] 10 $digest() iterations reached. Aborting!
Watchers fired in the last 5 iterations: []
http://errors.angularjs.org/1.3.0/$rootScope/infdig?p0=10&p1=%5B%5D
    at REGEX_STRING_REGEXP (http://ajax.googleapis.com/ajax/libs/angularjs/1.3.0/angular.js:80:12)
    at Scope.$get.Scope.$digest (http://ajax.googleapis.com/ajax/libs/angularjs/1.3.0/angular.js:14003:19)
    at Scope.$get.Scope.$apply (http://ajax.googleapis.com/ajax/libs/angularjs/1.3.0/angular.js:14227:24)
    at done (http://ajax.googleapis.com/ajax/libs/angularjs/1.3.0/angular.js:9493:47)
    at completeRequest (http://ajax.googleapis.com/ajax/libs/angularjs/1.3.0/angular.js:9678:7)
    at XMLHttpRequest.requestLoaded (http://ajax.googleapis.com/ajax/libs/angularjs/1.3.0/angular.js:9621:9) angular.js:11358
Uncaught Error: [$rootScope:infdig] 10 $digest() iterations reached. Aborting!
Watchers fired in the last 5 iterations: []
http://errors.angularjs.org/1.3.0/$rootScope/infdig?p0=10&p1=%5B%5D angular.js:80
Error: [$rootScope:infdig] 10 $digest() iterations reached. Aborting!
Watchers fired in the last 5 iterations: []
http://errors.angularjs.org/1.3.0/$rootScope/infdig?p0=10&p1=%5B%5D
    at REGEX_STRING_REGEXP (http://ajax.googleapis.com/ajax/libs/angularjs/1.3.0/angular.js:80:12)
    at Scope.$get.Scope.$digest (http://ajax.googleapis.com/ajax/libs/angularjs/1.3.0/angular.js:14003:19)
    at Scope.$get.Scope.$apply (http://ajax.googleapis.com/ajax/libs/angularjs/1.3.0/angular.js:14227:24)
    at done (http://ajax.googleapis.com/ajax/libs/angularjs/1.3.0/angular.js:9493:47)
    at completeRequest (http://ajax.googleapis.com/ajax/libs/angularjs/1.3.0/angular.js:9678:7)
    at XMLHttpRequest.requestLoaded (http://ajax.googleapis.com/ajax/libs/angularjs/1.3.0/angular.js:9621:9) angular.js:11358
Uncaught Error: [$rootScope:infdig] 10 $digest() iterations reached. Aborting!
Watchers fired in the last 5 iterations: []
http://errors.angularjs.org/1.3.0/$rootScope/infdig?p0=10&p1=%5B%5D 

and the page is reloaded through a GET request. So I losing all my changes and error messages.

Now, I know that the mentioned exception most of the times is related to watching expressions. However this is not true in my case since I've checked all my watch expressions and even disabled them completely. Also, I've added a pause on exception in google and noticed that this exception is thrown on the this.$eval(expr); of the following code:

$apply: function(expr) {
        try {
          beginPhase('$apply');
          return this.$eval(expr);
        } catch (e) {
          $exceptionHandler(e);
        } finally {
          clearPhase();
          try {
            $rootScope.$digest();
          } catch (e) {
            $exceptionHandler(e);
            throw e;
          }
        }
      },

while expr contains the following string:

function () {
          element.data('$injector', injector);
          compile(element)(scope);
        } 

Can anybody -more experienced with angular.js than me- explain to me what's going on ?

Please don't tell me to use django-angular or to use the normal flow submission of angular.js. I will check these solutions only as a last resort. As I said before when there are no errors the form is submitted without problem and I only get this behavior when the POST returns with errors.

TIA

4
  • Did you search google for the error? Oct 16, 2014 at 9:26
  • Of course - as I said most people say that it is a problem with watching expressions. However this is not my case.
    – Serafeim
    Oct 16, 2014 at 9:53
  • could then provide some insight of your form and watch that you disabled? Oct 16, 2014 at 10:07
  • The thing is that I believe that angular behaves badly when it retrieves the POST response from django. Why should that happen ?
    – Serafeim
    Oct 16, 2014 at 10:47

1 Answer 1

0

Actually I solved it:

In the __init__ method of my Form I had self.helper.form_action ='#' in order to make angular.js post the form (if you leave the action empty angular wants to handle the form using ajax). When I changed it to self.helper.form_action ='.' it worked!

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.