lnickers2004/index.html

## index.html
<!DOCTYPE html>
<html ng-app="app">
<head>
<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
  <meta charset=utf-8 />
  <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.2/angular.min.js"></script>
<meta name="description" content="$scope.$apply example" />
  </script>
  <title></title>
</head>
<body>

  <div ng-controller="One">
    <button class="apply1">Apply my scope!</button>
    a is {{obj.a}}
  </div>

  <div ng-controller="Two">
    <button class="apply2">Apply my scope!</button>
    <button class="digest2">Digest my scope!</button>
  </div>

<script id="jsbin-javascript">
var obj={a:1};
setInterval(function(){
  console.log(obj.a++);
}, 1000);

var scope1, scope2;

$('.apply1').click(function(){
  console.log("Applier1 clicked!");
  scope1.$apply();
});

$('.digest1').click(function(){
  console.log("Digester1 clicked!");
});

$('.apply2').click(function(){
  console.log("Applier2 clicked!");
  scope2.$apply();
});

$('.digest2').click(function(){
  console.log("Digester2 clicked!");
  scope2.$digest();
});


angular.module('app', [])

.controller('One', function($scope){
  scope1 = $scope;
  $scope.obj = obj;

  $scope.applier = function(){
    $scope.$apply();
  };

})

.controller('Two', function($scope){
  scope2 = $scope;
  $scope.applier = function(){
    $scope.$apply();
  };
})
;
</script>

<script id="jsbin-source-html" type="text/html"><!DOCTYPE html>
<html ng-app="app">
<head>
<script src="//code.jquery.com/jquery-1.9.1.min.js"><\/script>
  <meta charset=utf-8 />
  <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.2/angular.min.js"><\/script>
<meta name="description" content="$scope.$apply example" />
  <\/script>
  <title></title>
</head>
<body>

  <div ng-controller="One">
    <button class="apply1">Apply my scope!</button>
    a is {{obj.a}}
  </div>

  <div ng-controller="Two">
    <button class="apply2">Apply my scope!</button>
    <button class="digest2">Digest my scope!</button>
  </div>

</body>
</html></script>


<script id="jsbin-source-javascript" type="text/javascript">var obj={a:1};
setInterval(function(){
  console.log(obj.a++);
}, 1000);

var scope1, scope2;

$('.apply1').click(function(){
  console.log("Applier1 clicked!");
  scope1.$apply();
});

$('.digest1').click(function(){
  console.log("Digester1 clicked!");
});

$('.apply2').click(function(){
  console.log("Applier2 clicked!");
  scope2.$apply();
});

$('.digest2').click(function(){
  console.log("Digester2 clicked!");
  scope2.$digest();
});


angular.module('app', [])

.controller('One', function($scope){
  scope1 = $scope;
  $scope.obj = obj;

  $scope.applier = function(){
    $scope.$apply();
  };

})

.controller('Two', function($scope){
  scope2 = $scope;
  $scope.applier = function(){
    $scope.$apply();
  };
})
;</script></body>
</html>

## jsbin.beniha.js
var obj={a:1};
setInterval(function(){
  console.log(obj.a++);
}, 1000);

var scope1, scope2;

$('.apply1').click(function(){
  console.log("Applier1 clicked!");
  scope1.$apply();
});

$('.digest1').click(function(){
  console.log("Digester1 clicked!");
});

$('.apply2').click(function(){
  console.log("Applier2 clicked!");
  scope2.$apply();
});

$('.digest2').click(function(){
  console.log("Digester2 clicked!");
  scope2.$digest();
});


angular.module('app', [])

.controller('One', function($scope){
  scope1 = $scope;
  $scope.obj = obj;

  $scope.applier = function(){
    $scope.$apply();
  };

})

.controller('Two', function($scope){
  scope2 = $scope;
  $scope.applier = function(){
    $scope.$apply();
  };
})
;
	<!DOCTYPE html>
	<html ng-app="app">
	<head>
	<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
	<meta charset=utf-8 />
	<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.2/angular.min.js"></script>
	<meta name="description" content="$scope.$apply example" />
	</script>
	<title></title>
	</head>
	<body>

	<div ng-controller="One">
	<button class="apply1">Apply my scope!</button>
	a is {{obj.a}}
	</div>

	<div ng-controller="Two">
	<button class="apply2">Apply my scope!</button>
	<button class="digest2">Digest my scope!</button>
	</div>

	<script id="jsbin-javascript">
	var obj={a:1};
	setInterval(function(){
	console.log(obj.a++);
	}, 1000);

	var scope1, scope2;

	$('.apply1').click(function(){
	console.log("Applier1 clicked!");
	scope1.$apply();
	});

	$('.digest1').click(function(){
	console.log("Digester1 clicked!");
	});

	$('.apply2').click(function(){
	console.log("Applier2 clicked!");
	scope2.$apply();
	});

	$('.digest2').click(function(){
	console.log("Digester2 clicked!");
	scope2.$digest();
	});



	angular.module('app', [])

	.controller('One', function($scope){
	scope1 = $scope;
	$scope.obj = obj;

	$scope.applier = function(){
	$scope.$apply();
	};

	})

	.controller('Two', function($scope){
	scope2 = $scope;
	$scope.applier = function(){
	$scope.$apply();
	};
	})
	;
	</script>

	<script id="jsbin-source-html" type="text/html"><!DOCTYPE html>
	<html ng-app="app">
	<head>
	<script src="//code.jquery.com/jquery-1.9.1.min.js"><\/script>
	<meta charset=utf-8 />
	<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.2/angular.min.js"><\/script>
	<meta name="description" content="$scope.$apply example" />
	<\/script>
	<title></title>
	</head>
	<body>

	<div ng-controller="One">
	<button class="apply1">Apply my scope!</button>
	a is {{obj.a}}
	</div>

	<div ng-controller="Two">
	<button class="apply2">Apply my scope!</button>
	<button class="digest2">Digest my scope!</button>
	</div>

	</body>
	</html></script>


	<script id="jsbin-source-javascript" type="text/javascript">var obj={a:1};
	setInterval(function(){
	console.log(obj.a++);
	}, 1000);

	var scope1, scope2;

	$('.apply1').click(function(){
	console.log("Applier1 clicked!");
	scope1.$apply();
	});

	$('.digest1').click(function(){
	console.log("Digester1 clicked!");
	});

	$('.apply2').click(function(){
	console.log("Applier2 clicked!");
	scope2.$apply();
	});

	$('.digest2').click(function(){
	console.log("Digester2 clicked!");
	scope2.$digest();
	});



	angular.module('app', [])

	.controller('One', function($scope){
	scope1 = $scope;
	$scope.obj = obj;

	$scope.applier = function(){
	$scope.$apply();
	};

	})

	.controller('Two', function($scope){
	scope2 = $scope;
	$scope.applier = function(){
	$scope.$apply();
	};
	})
	;</script></body>
	</html>