JSFiddle - React, Tailwind, and code Playground

HTML

<div ng-app='myApp'>
<div ng-controller='ctrl1'>
controller 1
<input type='text' ng-model='data'>
<button ng-click='setVal()'>
Change
</button>
</div>
<hr>
<div ng-controller='ctrl2'>
controller 2
<input type='text' ng-model='data'>
</div>


</div>

JavaScript

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

app.controller('ctrl1', function($scope, $rootScope){
$scope.data = 'data';
$rootScope.data1 = 'old data';
$scope.setVal = function(){
$rootScope.data1 = 'new data';
}
});

app.controller('ctrl2', function($scope, $rootScope){
$scope.data = $rootScope.data1;
$scope.$watch('data1', function(o, n){

$scope.data = $rootScope.data1;

})
});