FAQ

Editors: put 2 spaces at the end of a question to create a <br>

(There's a new Testing section below)

1. Where can I find good learning resources?
   Learning Resources

2. How do I access the DOM from a controller?
   DO NOT perform DOM selection/traversal from the controller. The HTML hasn't rendered yet. Look up 'directives'.

3. Why does angular say my controllers/directives/etc are missing?
   Calling angular.module('myApp', []) will ALWAYS create a new module (and wipe out your existing one). Instead, make sure to call angular.module('myApp') with only 1 parameter to refer to an already created module.

4. How to render unescaped data?
   ng-bind-html-unsafe

5. How can I watch when an array/object/ngResource query is modified?
   $scope.$watch has a third parameter to monitor changes by value (and not by reference).

6. How can I serialize form data for submitting?
   Don't. Don't try to collect input values manually. Just attach ng-model="data.myField" onto every form input and take a gander at $scope.data when you finally need it.

7. Always have a '.' in your ng-models.
   Misko best practice.

8. How should I access the scope from providers (services)?
   $rootScope is equivalent to the ng-app tag and can be injected into your bootstrap or services to add functions and values accessible on all scopes. Try to avoid abusing this as much as possible

9. What is the difference between module().factory() and module().service()?
   Checkout this discussion thread.

10. How do I prevent Flash Of Unstyled Content (FOUC) (and curly braces)?
    Leverage ng-bind instead of {{}} and ng-cloak in a few places

11. Nested Routes / Views?
    Maybe...

12. Can I specify templates or partials inline?
    Yes! You can always do <script id="some/partial.html" type="text/ng-template"> and angular will use it instead!

13. How do I use a port in my ngResource url?
    Escape it: $resource('example.com\\:8080')

14. Why do plugins that trigger the change event not seem to work?
    Angular watches the input event, not the 'change' event.

15. Don't use jQuery to toggle crap. Just use a lot of variable flags inline: <a ng-click="flags.open=!flags.open">...<div ng-class="{active:flags.open}">

16. How can I view the scope from the DOM inspector?
    Google Chrome: install the Batarang extension, inspect a DOM element, then type $scope in the console
    Firefox / Firebug: inspect a DOM element, then type angular.element($0).scope() (or $($0).scope()) in the console

17. Do you have any good directive samples / libraries?
    AngularUI is an awesome collection of AngularJS tools (and even BETTER example code).

18. Internet Explorer!?!
    For IE v8.0 or earlier you may want to read this and use this.

19. Do I have to use the # for the router?
    $locationProvider

20. You should try using the AngularUI Passthru Directive (uiJq) before trying to roll your own jQuery plugin wrapper directive.

21. Why is my $scope.$watch() firing recursively?
    If you change newVal inside your $scope.$watch(newVal, oldVal) it could fire again (recursively?). After a $watch() is runs, the $scope is re-evaluated and relevant watchers will be re-triggered.

22. When should I use $scope.$apply()?
    You should ONLY use $scope.$apply in non-angular events/callbacks. It usually doesn't belong anywhere else.

23. With html5mode enabled, how do I get the default <a href> behavior back? If you want a link to cause a full page refresh then add target="_self" to your <a> tag

24. How do I .preventDefault() or .stopPropagation()?
    All ng-click and related bindings inject a $event object that you can call things like .preventDefault() or even pass the object to your methods

25. AngularJS isn't working in my Chrome extension!
    You want to use ng-csp

Testing

1. Rejecting / Resolving a $q.defer() doesn't go through
   You must add a $scope.$apply() for these to process

2. Jasmine spyOn() is not executing the spy'd function
   Not necessarily an AngularJS question, but you need to append .andCallThrough()

3. How do I test async code?
   Focus on creating mocks (fake objects / functions) that let you flush the async stuff synchronously. $timeout has a .flush() method specifically for this reason, just remember to add a $scope.$apply() too. If that still doesn't work, look up Jasmine's runs() and waits() functions.

4. How does module() and inject() work?
   You can call module() as many times as you want, and spin up as many unrelated modules as you want at time BEFORE your very first inject() is called. All subsequent calls to module() afterwards will either behave incorrectly or fail. If you load modules that contain assets with the same name, the last module to have loaded for that specific test will take precedence. This is a useful and simplistic way to load mock assets.