Suggested Videos
Part 34 - AngularJS controller as vs scope
Part 35 - AngularJS caseInsensitiveMatch and Inline Templates
Part 36 - AngularJS route reload
(追記) (追記ここまで)
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
View HTML :
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.
Difference between $scope and $rootScope
AngularJS tutorial for beginners
Part 34 - AngularJS controller as vs scope
Part 35 - AngularJS caseInsensitiveMatch and Inline Templates
Part 36 - AngularJS route reload
(追記) (追記ここまで)
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 :
<divng-controller="redColourController">
Root Scope Colour : {{rootScopeColour}}<br/>
Red Colour Controller : {{redColour}}<br/>
Green Colour Controller :
<spanstyle="color:red"ng-show="greenColour ==
undefined">
greenColour is undefined
</span>
</div>
<br/>
<divng-controller="greenColourController">
Root Scope Colour : {{rootScopeColour}}<br/>
Green Colour Controller : {{greenColour}}<br/>
Red Colour Controller :
<spanstyle="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.
Difference between $scope and $rootScope
AngularJS tutorial for beginners
No comments:
Post a Comment
It would be great if you can help share these free resources
[フレーム]