Sharing data using rootscope

https://groups.google.com/d/msg/angular/-/7Z_6p5pFi2oJ

HTML

<script src="http://docs.angularjs.org/angular-1.0.0rc12.min.js"></script>
<link rel="stylesheet" href="http://twitter.github.com/bootstrap/assets/css/bootstrap.css">
<div ng-controller="RootCtrl">
    
    <div ng-controller="SummaryCtrl">
        <h4>{{AllMyData.persons.length}} <small>Persons</small></h4>
        <h4>{{AllMyData.pets.length}} <small>Pets</small></h4>  
<button ng-click="replace()" >Replace Model Data</button>        
    </div>
    
    <div ng-controller="PersonCtrl"> 
        <ul>
            <li ng-repeat="p in AllMyData.persons">{{p}}</li>
        </ul>            
        <button ng-click="add()" >Add to Persons</button>
     </div>
    
    <div ng-controller="PetCtrl">        
        <ul>
            <li ng-repeat="p in AllMyData.pets">{{p}}</li>
        </ul>            
         <button ng-click="add()">Add to Pets</button>
     </div>

    <pre>    
    {{AllMyData|json}}
    </pre>
</div>

JavaScript

var rootScope = null;

function RootCtrl($rootScope) {
    rootScope = $rootScope;
    $rootScope.AllMyData = { 
        persons: ['Jim', 'Jane', 'Heidi'],
        pets: ['Fido', 'Spot']  
    }

    $rootScope.update = function  () {
        $rootScope.AllMyData.persons.push('Just Random Person'); 
        $rootScope.$apply(); //without this, it wont update UI
    }
}
function PersonCtrl($scope) {
        $scope.add = function() {
            $scope.AllMyData.persons.push('Another Person');        
        }
            
}
function PetCtrl($scope) {
    $scope.add = function() {
       $scope.AllMyData.pets.push('Another Pet');        
    }
}

function SummaryCtrl($rootScope) {
        $rootScope.replace = function() {
            $rootScope.AllMyData = { 
            persons: ['Jim2', 'Jane2', 'Heidi2'],
            pets: ['Fido2', 'Spot2']  
        }  
        }
}            

//simulating call from outside angular, for example polling website for new data and updating when changes are received
setTimeout(function () {
    rootScope.update();
}, 1000);