Ng-Bind-4

 

In this example user.firstName is bind with the first textbox and user.lastName is bind with the second textbox. These variables are also bind with the span tag for print the full name. As you type in the firstname and lastname textbox the full user name will show in the span below.

 
 
 
<!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title></title> <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.2/angular.min.js"></script> </head> <body ng-app="myApp"> <div ng-controller="myController"> First Name : <input type="text" ng-model="user.firstName" /><br /> Last Name: <input type="text" ng-model="user.LastName" /> <br /> <b>User Name</b> <span ng-bind="user.firstName"></span>,<span ng-bind="user.LastName"></span> </div> <script> var app = angular.module("myApp", []); app.controller('myController', ['$scope', function ($scope) { $scope.user = { firstName: "Abc", LastName: "Xyz", }; }]); </script> </body> </html>
Output