Online Snippets Library

Twoway Data Binding Example in AngularJS

In Below Example we will perform twoway data binding in AngularJS.He We use the "ng-model" directive to bind a model variable to the HTML element.

In Below example, we bind the firstName and lastName model variables to input HTML elements.


<!DOCTYPE html>
<script src="//"></script>
<body ng-app ng-init="firstName = 'Max'; lastName = 'Joe';">
<strong>First name:</strong> {{firstName}}<br />
<strong>Last name:</strong> <span ng-bind="lastName"></span><br />
<label>Set First name: <input type="text" ng-model="firstName"/></label><br />
<label>Set Last name: <input type="text" ng-model="lastName"/></label>