Angular ng-bind Directive

The “ng-bind” as the name suggest is used to bind/replace text content of any particular HTML element with the value of given expression that is used against the ng-bind. 

The value of the specified HTML element will be updated whenever the value of given expression will be changes.

The example code as given below,
//The AngularJs code sample
  
var app = angular.module("AngularApp", []);
app.controller("HelloController", function ($scope) {
      $scope.text = "";
});

//The AngularJs HTML code sample
  
<div ng-app="AngularApp">
    <div ng-controller="HelloController">
         Enter anything you want to display: <input type="text" ng-model="text">
           You entered : <span ng-bind="text"></span>
    </div>
</div>

//The full example code as given below

<!DOCTYPE html>
<html lang="en">

<head>
    <title>Angular Demo</title>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js" type="text/javascript" charset="utf-8"></script>
    <script>
        var app = angular.module("AngularApp", []);
        app.controller("HelloController", function ($scope) {
            $scope.text = "";
        });
  </script>
</head>

<body ng-app="AngularApp">
    <div ng-controller="HelloController">
        Enter anything you want to display :
        <input type="text" ng-model="text">you entered : <span ng-bind="text"></span>
    </div>
</body>
</html>

The output as below,

About Blogger

ANIL SINGH

Hey! I am Anil Singh. I am Active Blogger, Writer and Programmer. I love learning new technologies, programming, blogging and participating the forum discussions more...
http://www.code-sample.com
http://www.code-sample.xyz

    Blogger Comment
    Facebook Comment

0 comments:

Post a Comment

SQL Server NodeJs TypeScript JavaScript Angular SQL Server My Book