Difference between $scope and $rootScope
Difference between $scope and $rootScope
In this video we will discuss the difference between $scope and $rootScope. The main difference is that, $rootScope is available globally (for all controllers), whereas $scope is only available to the controller that has created it and it's children.
Let us understand this with an example.
Controller Code : We have 2 controllers (redColourController & greenColourController). redColourController has set redColour property on $scope and rootScopeColour on $rootScope. This means redColour property cannot be used outside the redColourController, where as rootScopeColour that is set on $rootScope can be used anywhere. greenColourController has set greenColour property on $scope. This means greenColour property cannot be used outside the greenColourController
var app = angular
.module("Demo", [])
.controller("redColourController", function ($scope, $rootScope) {
$rootScope.rootScopeColour = "I am Root Scope Colour";
$scope.redColour = "I am Red Colour";
})
.controller("greenColourController", function ($scope) {
$scope.greenColour = "I am Green Colour";
})
View HTML :
Removing angle brackets here while uploading this description which is not supporting
div ng-controller="redColourController"
Root Scope Colour : {{rootScopeColour}} br /
Red Colour Controller : {{redColour}} br /
Green Colour Controller :
span style="color:red" ng-show="greenColour == undefined"
greenColour is undefined
/span
/div
br /
div ng-controller="greenColourController"
Root Scope Colour : {{rootScopeColour}} br /
Green Colour Controller : {{greenColour}} br /
Red Colour Controller :
span style="color:red" ng-show="redColour == undefined"
redColour is undefined
/span
/div
Output : From the output it is clear that the rootScopeColour property that is set on $rootScope is available for both the controllers (redColourController & greenColourController). Where as redColour property set on $scope is available only for redColourController and not for greenColourController. Similarly, greenColour property set $scope is available only for greenColourController and not redColourController. Hope this example has made the difference between $rootScope and $scope clear.
On this page of the site you can watch the video online Difference between $scope and $rootScope with a duration of hours minute second in good quality, which was uploaded by the user phani sekhar veesam 07 April 2017, share the link with friends and acquaintances, this video has already been watched 89 times on youtube and it was liked by 1 viewers. Enjoy your viewing!
