codef0rmer/share-data-angular.html

## share-data-angular.html
<!DOCTYPE html>
<html ng-app="myApp">
<head>
<script src="http://cdnjs.cloudflare.com/ajax/libs/angular.js/1.0.1/angular.min.js"></script>
<script>
  var myApp = angular.module('myApp', []);

  myApp.run(function($rootScope) {
     $rootScope.btnVal = 'You can change my value';
  });

  myApp.controller('myCtrl', function($scope, $rootScope) {
    $scope.changeValue = function() {
      $rootScope.btnVal = $scope.input || 'You can change my value';
    };
  });
</script>
<style>
  div[ng-controller],html[ng-app] { border: 1px dashed red;}
</style>
<meta charset=utf-8 />
<title>JS Bin</title>
</head>
<body>
  <div>
    <div ng-controller="myCtrl">
        Change Value <input ng-model='input' ng-change="changeValue()" />
    </div>
    <button>{{btnVal}}</button>
</div>
</body>
</html>
	<!DOCTYPE html>
	<html ng-app="myApp">
	<head>
	<script src="http://cdnjs.cloudflare.com/ajax/libs/angular.js/1.0.1/angular.min.js"></script>
	<script>
	var myApp = angular.module('myApp', []);

	myApp.run(function($rootScope) {
	$rootScope.btnVal = 'You can change my value';
	});

	myApp.controller('myCtrl', function($scope, $rootScope) {
	$scope.changeValue = function() {
	$rootScope.btnVal = $scope.input \|\| 'You can change my value';
	};
	});
	</script>
	<style>
	div[ng-controller],html[ng-app] { border: 1px dashed red;}
	</style>
	<meta charset=utf-8 />
	<title>JS Bin</title>
	</head>
	<body>
	<div>
	<div ng-controller="myCtrl">
	Change Value <input ng-model='input' ng-change="changeValue()" />
	</div>
	<button>{{btnVal}}</button>
	</div>
	</body>
	</html>