When the scope model changes, the view updates automatically.
How does AngularJS do that?
$digest loop What happens during the $digest loop? All $watch(ed) expressions are checked for model mutations
If a mutation is detected, the $watch listener is called. $scope.$watch('variable', function (newVal, oldVal) { if (!newVal) return; ... console.log('value changed!') });
$digest loop
Do it 10x (max) $scope.$watch('variable1', function (newVal, oldVal) { if (!newVal) return; $scope.variable2 = variable1 * 2 }); $scope.$watch('variable2', function (newVal, oldVal) { if (!newVal) return; $scope.variable3 = variable2 + 3 });
Angular Execution Context

data-binding
exception handling
property watching
When not in Angular Execution Context?

Use $apply to trigger the $digest loop
$scope.$apply() is a way to gain access to the
Angular Execution Context
$scope.$apply('variable = "value"'); $scope.$apply(function(scope) { scope.variable = 'value'; }); $scope.$apply(function(){ $scope.variable = 'value'; }); $scope.$apply()
$evalAsync allows functions or expressions to be
run sometime in the future (during the $digest loop)
before the browser renders
scope.$evalAsync(function() { ... do something ... });
$digest loop
=
$evalAsync loop + $watch loop