Updating Parent Scope

http://angularjs.org/

HTML

<div ng-app="myApp" id="tableForVxp" class="dataDisplay2">
    <div ng-controller="ControllerZero">
        <input ng-model="ob.message">{{ob.message}}
        <button ng-click="handleClick(ob.message);">Broadcast</button>
        <div ng-controller="ControllerOne">
            <input ng-model="ob.message">{{ob.message}}</div>
        <div ng-controller="ControllerTwo">
            <input ng-model="ob.message">{{ob.message}}</div>
    </div>
</div>

JavaScript

var myApp = angular.module('myApp', []);

myApp.controller('ControllerZero', function ($scope) {
    $scope.handleClick = function (msg) {
        alert("broadcasting");
        $scope.$broadcast('handleBroadcast',{ message: msg});
    };
})
myApp.controller('ControllerOne', function ($scope) {

    $scope.$on('handleBroadcast', function (event, args) {
		event.stopPropagation();
        $scope.ob.message = 'ONE: ' + args.message; 
        alert("ControllerOne has updated");
        
    });
})
myApp.controller('ControllerTwo', function ($scope) {
    $scope.$on('handleBroadcast', function (event, args) {
        $scope.ob.message = 'TWO: ' + args.message;
        alert("ControllerTwo has updated");
    });
})