AngularJS using $rootScope as a data store

by

This question is addressed in the AngularJS FAQ quoted here:

Occasionally there are pieces of data that you want to make global to
the whole app. For these, you can inject $rootScope and set values on
it like any other scope. Since the scopes inherit from the root scope,
these values will be available to the expressions attached to
directives like ng-show just like values on your local $scope.

It seems that the team does encourage using $rootScope this way, with this caveat:

Of course, global state sucks and you should use $rootScope sparingly,
like you would (hopefully) use with global variables in any language.
In particular, don’t use it for code, only data. If you’re tempted to
put a function on $rootScope, it’s almost always better to put it in a
service that can be injected where it’s needed, and more easily
tested.

Conversely, don’t create a service whose only purpose in life is to
store and return bits of data.

This does not put too much load on the $digest cycle (which implements basic dirty checking to test for data mutation) and this is not an odd way to do things.

EDIT: For more details on performance, see this answer from Misko (AngularJS dev) here on SO: How does data binding work in AngularJS? Specifically note the section on performance.

More Related Contents:

  1. Losing scope when using ng-include
  2. How to pass parameters using ui-sref in ui-router to controller
  3. Angularjs Uncaught Error: [$injector:modulerr] when migrating to V1.3
  4. How to set an iframe src attribute from a variable in AngularJS
  5. AngularJS Error: Cross origin requests are only supported for protocol schemes: http, data, chrome-extension, https
  6. AngularJS – Value attribute on an input text box is ignored when there is a ng-model used?
  7. How to pass parameters using ui-sref in ui-router to the controller
  8. What is the correct syntax of ng-include?
  9. angularjs to output plain text instead of html
  10. AngularJS – ng-disabled not working for Anchor tag
  11. $watch an object
  12. AngularJS: Better way to watch for height change
  13. ion-content and ion-footer have different $scope
  14. How to remove an item from an array in AngularJS scope?
  15. Angularjs: call other scope which in iframe
  16. CSS: Change parent on focus of child
  17. Angularjs does not load scripts within ng-view
  18. In AngularJS, any inline javascript code that included in HTML templates doesn’t work
  19. Remove ‘All Files’ option from HTML file input
  20. ng-click not working in dynamically created content
  21. Ionic Framework: $scope is undefined in simple alert
  22. angularjs custom filter to check for values inside a data array
  23. Webstorm: “Cannot Resolve Directory”
  24. AngularJs – Best-Practices on adding an active class on click (ng-repeat)
  25. Clear localStorage on tab/browser close but not on refresh
  26. Angular controller scope not updating after jQuery ajax call
  27. Rename Object Key in an array using javascript
  28. multiple ui-view html files in ui-router
  29. AngularJS event on window innerWidth size change
  30. Decode HTML entity in Angular JS

Leave a Comment