The
ng-bind-template directive is
similar to the ng-bind directive,
the ng-bind directive supports binding for only one variable / property from
the model, while the ng-bind-template directive can bind more than one model
variable / property in a single template.
The ng-bind directive provides one way binding between the model and the View, and changes made in the view will not be reflected in the model. The ng-bind-template achieves the same in addition supports binding multiple value at once.
The below example shows a simple implementation of ng-bind-template to achieve one way data binding between the model and the view using multiple values.
<html ng-app>
<head>
<meta charset="utf-8" />
<title>AngularJS - Basic</title>
<script src="angular.min.js"></script>
</head>
<body>
<div ng-init="FName='FirstName';LName = 'LastName'">
<span type="text" ng-bind-template="Your name is: {{LName}}, {{FName}}"></span><br/><br/>
</div>
</body>
</html>
Output
The ng-bind directive provides one way binding between the model and the View, and changes made in the view will not be reflected in the model. The ng-bind-template achieves the same in addition supports binding multiple value at once.
The below example shows a simple implementation of ng-bind-template to achieve one way data binding between the model and the view using multiple values.
<html ng-app>
<head>
<meta charset="utf-8" />
<title>AngularJS - Basic</title>
<script src="angular.min.js"></script>
</head>
<body>
<div ng-init="FName='FirstName';LName = 'LastName'">
<span type="text" ng-bind-template="Your name is: {{LName}}, {{FName}}"></span><br/><br/>
</div>
</body>
</html>
Output
No comments:
Post a Comment