0

Since $scope.$root is a reference to $rootScope and therefore the same thing, why should I bother injecting $rootScope when I need to use it if I already have access to it through $scope.$root? What are the reasons, whether they are AngularJS best practices or general programming best practices, of using $rootScope over $scope.$root?

For clarity, this is not a question about when to use $rootScope. It's asking why I should use it.

ross_troha
  • 165
  • 2
  • 10
  • What in the world is $root.$scope? – Kyle Krzeski Jul 12 '17 at 14:35
  • @WilliamHampshire Thanks, I will edit that... – ross_troha Jul 12 '17 at 14:36
  • duplicate of https://stackoverflow.com/questions/22216441/what-is-the-difference-between-scope-root-and-rootscope – Kyle Krzeski Jul 12 '17 at 14:37
  • This has already been answered: [https://stackoverflow.com/questions/22216441/what-is-the-difference-between-scope-root-and-rootscope](https://stackoverflow.com/questions/22216441/what-is-the-difference-between-scope-root-and-rootscope) – flyer Jul 12 '17 at 14:38
  • ^ this has already been answered (posted this a few seconds before you @flyer :P) – Kyle Krzeski Jul 12 '17 at 14:39
  • Except it's not a duplicate because I already know the difference. I'm asking what is the purpose of using $rootScope _at all_. What is the purpose of injecting something if it's already accessible through `$scope.$root` – ross_troha Jul 12 '17 at 14:39

3 Answers3

1

$rootScope: var which points to the parent of all the scopes and can be injected everywhere. All other scopes are children of the $rootScope. They are created via the $new method of the $rootScope thus every scope inherits from the $rootScope.

$scope.$root: holds a reference to the $rootScope.

There Is a difference between using $scope.$root and using $rootScope:

When $scope Is the root, its $root property is null

$scope.$root is only assigned on isolate scopes So you might have a situation where $scope.$root is null. Better use $rootScope instead...

Ankit Manchanda
  • 562
  • 6
  • 21
  • 1
    The bit about `$root` being null when `$scope` is `$rootScope` isn't true. https://github.com/angular/angular.js/blob/v1.5.11/src/ng/rootScope.js#L178 – ross_troha Jul 12 '17 at 14:53
  • *$scope.$root is only assigned on isolate scopes*... and prototypically inherited otherwise. There's no way how $scope.$root may be null in normal conditions. – Estus Flask Jul 12 '17 at 15:49
0

It makes sense to use $rootScope in your application. Like you mentioned, $scope.$root is simply a reference to $rootScope from your current $scope. If you're going to be referencing the root scope, you should inject and use $rootScope since it is an explicit declaration of the top-level $scope.

However, in general, AngularJS best practices usually lead the developer to stray away from using $rootScope. Although it is convenient to have a global scope that can be injected anywhere in your application, it is typically overused and abused causing too many objects to be on the $rootScope objects which can lead to slower performance in larger AngularJS applications.

Typically when I'm thinking about using $rootScope to globally hold something, I stop and think for a minute as to what a better approach might be. Perhaps a better solution could involve injecting a shared service/factory around instead of relying on the $rootScope.

Ben
  • 2,441
  • 1
  • 12
  • 16
0

It's a matter of taste to some degree, since it's a known fact that $rootScope === $scope.$root, even though $rootScope is tiny bit more performant and minifies better.

In modern AngularJS apps $scope isn't used much. $scope isn't always available in controllers with controllerAs syntax, including component controllers. $scope isn't available in services, too.

$rootScope is conventionally used instead of $scope.$root when root scope should be referred, for the sake of consistency.

Estus Flask
  • 206,104
  • 70
  • 425
  • 565