OpenSource For You

Data binding

-

AngularJS provides you with two-way binding between the model variables and HTML elements. One-way binding would mean a one-way relation between the two—when the model variables are updated, so are the values in the HTML elements; but not the other way around. Let’s understand two-way binding by looking at an example: <html ng-app > <head>

<script src="http://ajax.googleapis.com/ajax/libs/ angularjs/1.0.7/angular.min.js">

</script> </head> <body ng-init = “yourtext = ‘Data binding is cool!’ ”>

Enter your text: <input type="text" ng-model = "yourtext" />

<strong>You entered :</strong> {{yourtext}} </body> </html>

The model variable yourtext is bound to the HTML input element. Whenever you change the value in the input box, yourtext gets updated. Also, the value of the HTML input box is initialise­d to that of the yourtext variable.

Newspapers in English

Newspapers from India