11+ Year IT Industry Experience, Working as Technical Lead with Capgemini | Consultant | Leadership and Corporate Trainer | Motivational and Technical Speaker | Career Coach | Author | MVP | Founder Of RVS Group | Trained more than 4000+ IT professionals | Azure | DevOps | ASP.NET | C# | MVC | WEB API | ANGULAR | TYPESCRIPT | MEAN | SQL | SSRS | WEB SERVICE | WCF... https://bikeshsrivastava.blogspot.in/ http://bikeshsrivastava.com/

Two Way data Binding In AngularJs

Basic Example of Two way data binding :-
Step 1:-Create simple HTML page.
Step 2:-Include AngularJs library  to support Angularjs in your application inside head tag with script tag.
or /use CDN URL:-<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.5/angular.min.js"></script>
Step 3:-Run your html page.
<!DOCTYPE html>
<html>
<head>
<script src="angular.js"></script>
</head>
<body ng-app ng-init="firstName = 'Bikesh'; lastName = 'Srivastava';">
<strong>First name:</strong> {{firstName}}<br />
<strong>Last name:</strong> <span ng-bind="lastName"></span><br />
<br />
<label>Set the first name: <input type="text" ng-model="firstName"/></label><br />
<label>Set the last name: <input type="text" ng-model="lastName"/></label>
</body>
</html>
Description:-
We have a two way information tying when a model variable is bound to a HTML component that can both change and show the estimation of the variable. When all is said in done, we could have more than one HTML component bound to the same variable. 
We utilize the ng-model order to tie a model variable to the HTML component that can show its quality, as well as change it.
In the sample, we tie the firstName and lastName model variables to several HTML info components. At the point when the page is stacked, the estimation of the data components are instated to those of the individual model variables and at whatever point the client sorts something in an info, the estimation of the model variable is altered also (two way).
You have just read an article that categorized by title AngularJs by title Two Way data Binding In AngularJs. You can bookmark this page with a URL https://bikeshsrivastava.blogspot.com/2016/01/two-way-binding-in-angularjs.html. Thank You!
Author: Bikesh Srivastava - Saturday, January 16, 2016

1 comments for "Two Way data Binding In AngularJs"

  1. Really nice blog post.provided a helpful information.I hope that you will post more updates like this AngularJS4 Online Course Bangalore

    ReplyDelete

Life Is Complicated, But Now programmer Can Keep It Simple.