<body ng-app='MainApp'>
<div ng-controller='MainCtrl'>
<div>
<div>Controller1</div>
<input type='text' ng-model='text1'/>
</div>
</div>
<div ng-controller='MainCtrl2'>
<div>
<div>Controller2</div>
<input type='text' ng-model='text2'/>
</div>
</div>
</body>var mainMod = angular.module('MainApp', []);
mainMod.controller('MainCtrl', ['$scope','$rootScope',
function ($scope,$rootScope) {
$scope.$watch('text1',function(newValue,oldValue){
if(newValue){
$rootScope.text2 = newValue;
}
});
}
]);
mainMod.controller('MainCtrl2', ['$scope','$rootScope',
function ($scope,$rootScope) {
$scope.$watch('text2',function(value){
if(value){
$rootScope.text1 = value;
}
});
}
]);
External CSS
This Pen doesn't use any external CSS resources.