Post
Ask Question

Bind Data using Angular js

The following code snippet is a very basic example to demonstrate to bind and initialize the control using Angular js.
  1. <html>  
  2.     <body>  
  3.         <div ng-app="">  
  4.             <p>Enter your name in the text box: </p>  
  5.             <p>Name: <input type="text" ng-model="myname" ng-init="myname='kamal'" /></p>  
  6.               
  7.             <p>Entered Name: <p ng-bind="myname"></p></p>  
  8.         </div>  
  9.           
  10.         <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.2.15/angular.min.js"></script>  
  11.     </body>  
  12. </html> 

The ng-model directive binds element values (like the value of an input field) to the application.

The ng-bind directive binds application data to the HTML view.

The ng-initi directive is used to initialize the control with some predefine value. As in this example it is predefined with value "kamal".
 
This way ng-model binds the element value and ng-bind binds the data entered in the control to HTML view.