How does data binding work in AngularJS?

Question

How does data binding work in the AngularJS framework?

I haven\'t found technical details on their site. It\'s more or less clear how it works when data

Answer 1

data binding:

What is data binding?

Whenever the user changes the data in the view , there occurs an update of that change in the scope model, and viceversa.

How is it possible?

Short answer : With the help of digest cycle.

Description : Angular js sets the watcher on the scope model, which fires the listener function if there is a change in the model.

$scope.$watch('modelVar' , function(newValue,oldValue){

//Dom update code with new value

});

So When and How is the watcher function called?

Watcher function is called as part of the digest cycle.

Digest cycle is called automatically triggered as part of angular js built in directives/services like ng-model , ng-bind , $timeout, ng-click and others.. that let you trigger the digest cycle.

Digest cycle function:

$scope.$digest() -> digest cycle against the current scope.
$scope.$apply() -> digest cycle against the parent scope 

i.e$rootScope.$apply()

Note: $apply() is equal to $rootScope.$digest() this means the dirty checking starts right from the root or top or the parent scope down to all the child $scopes in the angular js application.

The above features work in the browsers IE for the mentioned versions also just by making sure your application is angular js application which means you are using the angularjs framework script file referenced in the script tag.

Thank you.