A Pen by Suman Paul.

A-Pen-by-Suman-Paul.markdown

A Pen by Suman Paul

A Pen by Suman Paul on CodePen.

License.

index.html

<div ng-app="myApp">
  <div ng-controller="parentCtrl">
  Name, <input type="text" ng-model="name">
  <br>
  My Child is {{ child }}   
    <div ng-controller="childCtrl">
        Name : <input type="text" ng-model="name">
        <br>
        My Parnets is <strong>{{ parent }}</strong>
    </div>

  </div>
</div>

script.js

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

function parentCtrl($scope) {
    $scope.name = 'parent';
    
    $scope.$watch('name', function(n, o){
        console.debug('Parent Changed');
        $scope.$broadcast('parent_changed', $scope.name);
    });
    
    $scope.$on('child_changed', function(e, m){
        console.log(e, m);
        $scope.child = m;
    });
}

function childCtrl($scope) {
    $scope.name = 'child';
    
    $scope.$watch('name', function(n, o){
        console.debug('Child Changed');
        $scope.$emit('child_changed', $scope.name);
    });
    
    $scope.$on('parent_changed', function(e, m){
        console.log(e, m);
        $scope.parent = m;
    });
    
}