Debugging Angular Debugging Angular angularjs angularjs

Debugging Angular


  1. If the problem is a run-time error inside one of your controllers you'll get the line number.

  2. If it's a problem interpreting something inline {{ like.this() }} or a problem with an expression in a directive (ex: ng-repeat='foo in undefinedBar'), or any other expression not running inside a script tag or reference, then you'll get the line of code from the angular framework where the error was first encountered (usually either the directive itself or the core).

  3. If one of your controllers simply doesn't parse due to incorrect syntax, it will tell you it can't even load the module. This also applies if there actually is a problem with how your app is set up, but I assume this question is for the times when you're trying to track down a hard-to-find error in a controller or view.

Usually when I experience #2 (most common source of frustration) I look for clues as to what type of error it is (maybe a collection wasn't defined if it tells me "length" was undefined, for instance). Usually the problem is tied to either bad syntax or my controller models not being in a state I expected.


You can click on :-

http://errors.angularjs.org/1.2.23/ng/areq?p0=AppController&p1=not%20a%20function%2C%20got%20undefined

This link ( 2nd line ) of the error. It would open the error description on the angular js website.

For example, in your case the error is :

Argument 'AppController' is not a function, got undefined

Which mean you have a typo in your controller or you have not made the controller at all. You can see this error once you click on that link.

Edit: If there is a error pertaining to your code like something undefined. You get a link to reach your code line as well. Following is a example of such a error, where a variable is undefined.

TypeError: Cannot read property 'filetype' of undefined    at Object.fn (http://localhost:8080/techpedia/js/Controller.js:1183:48)    at k.$digest (http://localhost:8080/techpedia/js/angular.min.js:109:403)    at k.$apply (http://localhost:8080/techpedia/js/angular.min.js:112:398)    at http://localhost:8080/techpedia/js/angular.min.js:18:270    at Object.d [as invoke] (http://localhost:8080/techpedia/js/angular.min.js:35:36)    at c (http://localhost:8080/techpedia/js/angular.min.js:18:178)    at fc (http://localhost:8080/techpedia/js/angular.min.js:18:387)    at Xc (http://localhost:8080/techpedia/js/angular.min.js:17:415)    at HTMLDocument.<anonymous> (http://localhost:8080/techpedia/js/angular.min.js:214:144)    at l (http://localhost:8080/techpedia/js/foundation.min.js:18:16937) 

The link will point out the line number in your code.

http://localhost:8080/techpedia/js/Controller.js:1183:48 


Verify if you properly defined AppController. Search AppController in your sources