With the ng-model directive, you can bind the value of an input field to a variable created in AngularJS.
The binding goes both ways. If the user changes the value inside the input field, the AngularJS property will also change its value.
Example: 1
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 |
<!DOCTYPE html> <html> <script src="https://code.angularjs.org/1.6.9/angular.min.js"></script> <body> <div ng-app="myApp" > <div ng-controller="myCtrl" > First Name: <input ng-model="firstName" > Last Name: <input ng-model="lastName" > <p>{{firstName}} {{lastName}}</p> </div> </div> <script> var app = angular.module("myApp", []); app.controller("myCtrl", function($scope) { // Intialize variable value $scope.firstName="John"; $scope.lastName="Appleseed"; }); </script> </body> </html> |
More Stories
AngularJS Dynamic Routes
Angular Demo Project
AngularJS Routes