Bài 4 $rootScope trong controller

Lượt xem: 4807

Xem demo

$rootScope là cha của một $scope  với $rootScope chúng ta có thể truy xuất dữ liệu từ một Controller tới những Controller khác.

Làm thế nào để định nghĩa một $rootScope trong Javascript?

<script>  
  myWebApp = angular.module('myWebApp', []);  
  myWebApp.controller("Controller01", function($scope, $rootScope){  
   $rootScope.message = 'Chào mừng đến với bài chia sẻ AngularJS';  
  });  
  myWebApp.controller("Controller02", function($scope){  
  });  
 </script>  

Sử dụng nó như thế nào trong HTML?

 <body ng-app=" myWebApp "> 
  <div ng-controller="Controller01"<  
     <input type="text" ng-model="message"/>  
     {{message}}  
  </div>
  <div ng-controller="Controller02"<
     <input type="text" ng-model="message"/>  
     {{message}}  
  </div> 
</body>  

Bạn sẽ biết rõ hơn về $rootScope sau khi chạy ví dụ bên dưới:

 <!DOCTYPE html>  
 <html> 
<script> 
 myWebApp = angular.module('myWebApp', []);  
 myWebApp.controller("Controller01", function($scope, $rootScope){  
   $rootScope.message = 'Chào mừng đến với bài chia sẻ AngularJS ';  
 });  
 myWebApp.controller("Controller02", function($scope){  
 });  
 </script>  
<body ng-app=" myWebApp "> 
 <div ng-controller="Controller01">
  <input type="text" ng-model="message"/>
     {{message}}  
</div>
<div ng-controller="Controller02">
 <input type="text" ng-model="message"/>
     {{message}}  
</div> 
</body> 
</html>

Xem thêm: Bài 5 ng-model trong AngularJS

Xem demo