Five common error messages in Angular.js and how to quickly solve them

When using Angular.js and something goes wrong with your code, the first place to look for an error message that came from your JavaScript code is in the console of the browser debugger that you use (for example Chrome developer tools or IE F12).

In the following list you see a collection of common error messages that you will most probably come along when you implement web application with Angular.js. Together with each message you see a quick solution to fix your code:

  • [ng:areq] Argument ‘XXXController’ is not a function, got undefined Solution: Check if you actually load the code for the specified controller. Did you forget to add the file of the controller in a

  • Error: [$injector:unpr] Unknown provider: XXXServiceProvider <- XXXService <- YYYController Solution: Check if you wrote the correct name in the service name. For example XXXService instead of xxxService

  • [ng:areq] Argument ‘fn’ is not a function, got string Solution: You can find more information in this stackoverflow question and also check your code if the definition of your controller with its dependencies ([] & function) is correct.

  • Uncaught SyntaxError: Unexpected token . Solution: Look if you have done something like this: var $rootScope.alert = {};. The problem here is that you cannot set $rootScope in a variable.

  • Avoid cyclic dependency injection Solution: More information can be found in this stackoverflow question

comments powered by Disqus