Bind Data using Angular js

This code snippet is a very basic example to demonstrate to bind and initialize the control using Angular js.

The following code snippet is a very basic example to demonstrate to bind and initialize the control using Angular js.

<html>
    <body>
        <div ng-app="">
            <p>Enter your name in the text box: </p>
            <p>Name: <input type="text" ng-model="myname" ng-init="myname='kamal'" /></p>

            <p>Entered Name: <p ng-bind="myname"></p></p>
        </div>

        <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.2.15/angular.min.js"></script>
    </body>
</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.