AJS - Directives ng-bind
ng-bind directive का इस्तेमाल HTML Element के किसी भी प्रकार के text content को bind या replace करने के लिए किया जाता है |
ng-bind directive से HTML Element पर expression की value को bind किया जाता है |
Syntax for ng-bind Directive in AngularJS
As Attribute : <element ng-bind="expression"> </element> As Class: <element class="ng-bind : expression"> </element>
ng-bind Attribute's Parameters in AngularJS
expression : यहाँ पर expression या variable दिया जाता है |
Example for ng-bind Directive in AngularJS
Source Code :
<html>
<head>
<script src="angularjs.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular.min.js"></script>
</head>
<body>
<div ng-app = "" ng-init="fruit = ['Orange', 'Mango', 'Apple']">
<div ng-repeat="f in fruit">
Fruit : <span ng-bind = "f"></span><br />
</div>
<p>Same As : </p>
<div ng-repeat="f in fruit">
{{"Fruit : " + f}}<br />
</div>
<p>Same As : </p>
<div ng-repeat="f in fruit">
Fruit : <span class="ng-bind: f"></span>
</div>
</div>
</body>
</html>
Output :
Fruit :
Same As :
{{"Fruit : " + f}}
Same As :
Fruit :
Example for Replacing Text Content of Element in AngularJS
Source Code :Output :<html> <head> <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular.min.js"></script> </head> <body> <div ng-app = "" ng-init="fruit = 'Hello Friends'"> Message : <span ng-bind = "fruit" />Hello World<br /> </div> </body> </html>
Message : Hello World