Angularjs Learning Notes (iii) a simple example of data bidirectional binding _angularjs

Bidirectional binding

Bi-directional binding is the most practical function of ANGULARJS, it saves a lot of code, so that we focus on data and views, do not waste a lot of code in the DOM monitor, data synchronization, about bidirectional update, you can look at the following figure:

Data--> View

Here we only demonstrate how to bind to the view after having the data.

<! DOCTYPE html>

 
 

After clicking the button, the div content becomes dick, the effect is as shown:

View-> Data

In the last example, when we look at the changes in the data, the view changes automatically. So this example is the reverse, the view changes, causing the data to change, then how do we know when the data changes, where we can show the data again through another element.

<! DOCTYPE html>

 
 

View Effects:

Implementation mechanism

Angular the usual DOM events, XHR events, and so on, which triggers the digest process into the angular.

Within the digest process, the traversal is started from Rootscope, and all watcher are checked.