डाउनलोड पी.डी.एफ. ई-बुक्स
AJS - Scope

$scope ये AngularJS का Object होता है | $scope Object पर कुछ properties और methods define किये जाते है |

$scope Object ये controller() function में पहले parameter पर दिया जाता है |

$scope Object ये View और Controller के बीच का binding हिस्सा होता है |


Example for $scope Object in AngularJS

Example पर controller के function पर $scope Object को pass किया गया है | यहाँ पर $scope Object पर कुछ properties को insert किया गया है और उस properties को Expression द्वारा View पर प्राप्त किया गया है |

Source Code :
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular.min.js"></script>
</head>
<body>

<div ng-app="app" ng-controller="ctrl">

<p>{{message}}</p>

<script>  
var myapp = angular.module("app", []);  
myapp.controller("ctrl", function($scope){  
	$scope.message = "Hello World"  
});  
</script>  

</div>

</body>
</html>
Output :
Hello World

Example for $rootScope Object in AngularJS

Example पर controller के function पर $rootScope Object को pass किया गया है | यहाँ पर $rootScope Object पर कुछ properties को insert किया गया है और उस properties को Expression द्वारा View पर प्राप्त किया गया है |

अगर Example में rootScope दिया जाता है तब वो पूरे application पर available होता है | For Example,
Example पर ctrl1 पर कुछ properties दी गयी है और ctr2 पर कोई properties नहीं है | ctrl1 में rootScope Object और Properties होने के कारण ctrl2 भी इनकी properties को प्राप्त कर सकता है |

Source Code :
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular.min.js"></script>
</head>
<body>

<div ng-app="app">

<div ng-controller="ctrl1">
<p>{{message}}</p>
<p>{{name}}</p>
</div>

<div ng-controller="ctrl2">
<p>{{message}}</p>
<p>{{name}}</p>
</div>

</div>

<script>  
var myapp = angular.module("app", []);  
myapp.controller("ctrl1", function($rootScope){  
	$rootScope.message = "Welcome";
	$rootScope.name = "UD";  
});

myapp.controller("ctrl2", function(){
});
</script>  

</body>
</html>
Output :
Welcome

UD

Welcome

UD

Another Example for $rootScope and $scope Object in AngularJS

Example पर तीन controller दिए गए है | इन controller में से एक में $rootScope, दूसरे में $scope और तीसरे में कुछ भी नहीं है |

पहले और दूसरे में same name की properties दी गयी है | इसीलिए HTML View पर वो अपनी खुद की properties की values को display करता है और तीसरे controller में कोई भी Object न होने के कारण वो $rootScope वाले controller की properties को access कर सकता है |

Source Code :
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular.min.js"></script>
</head>
<body>

<div ng-app="app">

<div ng-controller="ctrl1">
<p>{{name}}</p>
</div>

<div ng-controller="ctrl2">
<p>{{name}}</p>
</div>

<div ng-controller="ctrl3">
<p>{{name}}</p>
</div>

</div>

<script>  
var myapp = angular.module("app", []);  
myapp.controller("ctrl1", function($rootScope){  
	$rootScope.name = "UD";  
});

myapp.controller("ctrl2", function($scope){
	$scope.name = "Ramesh";
});

myapp.controller("ctrl3", function(){
});
</script>  

</body>
</html>

Output :
UD

Ramesh

UD