Pregled code-a:
<!DOCTYPE HTML> <html lang="hr"> <head> <meta charset="UTF-8"> <title>AngularJS - $scope.$parent</title> </head> <body ng-app="mojApp"> Primjer pokazuje upotrebu $parent.$scope svojstva. <br>Ako u Child kontroleru upotrijebimo <b>$scope.$parent.x++</b> onda dolazi do povećanja parent x varijable. Zbog nasljeđivanja istodobno će se povećati i child x varijabla. <br>Ako pak u Chilčd kontroleru upotrijebimo samo $scope.y++ to će se odnositi samo na child $scope tj. samo na child y variablu pa će parent y ostati nepromijenjen. <br><br> <div ng-controller="Parent"> parentX = {{x}} <br> parentY = {{y}} <br> <div ng-controller="Child"> childX = {{x}} <br> childY = {{y}} <br> <button ng-click="modifyBothScopes()">modify Both Scopes ( X ) - $scope.$parent.x++;</button><br> <button ng-click="modifyonlyChildscope()">modify only Child scope ( Y ) - $scope.y++</button> </div> </div> <script src="../angularjs/1.2.9/angular.min.js"></script> <script> var mojModul = angular.module('mojApp', []); mojModul.controller('Parent', function($scope){ $scope.x = 5; $scope.y = 5; }); mojModul.controller('Child', function($scope){ $scope.modifyBothScopes= function() { $scope.$parent.x++; }; $scope.modifyonlyChildscope= function() { // member "y" will be created in the child scope // So, after the following statment, $scope.$parent.y++ will only increment the parent scope. // It would not affect the child scope. $scope.y++; }; }); </script> </body> </html>
Pregled stranice:
Pogledaj stranicu
../javascript/angularjs/primjeri/29parent-scope.html
.