ng-bind-template

What is ng-bind-template:

ng-bind-template used to bind multiple angularJS expression, within {{ }} ..

Description of ng-bind-template:

ng-bind-template bind multiple angularJS expression dynamically , within {{ }} .In ng-bind we have restriction/limit with angularJS expression(we can bind one expression per directive or can say one ng-bind directive used for one expression. ), but ng-bind template do not follow this restrictions . This directive has priority 0..

Syntax of ng-bind-template:

<element ng-bind-template="{{expression1}}{{expression2}}">

</element>

or

<div ng-bind-template="{{expression1}}{{expression2}}"></div>

How to Use ng-bind-template/ng-bind-template Example::

 Example 1:

<div ng-app="webapp">

    <div ng-controller="angularjsexampleCtlr" ng-init="myexpression = 'Hello AngularJS.';yourexpression = 'This is Example Of AngularJS ng-bind-template.'">

        <div>

             <div ng-bind-template="{{myexpression}}{{yourexpression}}"></div>

        </div>

    </div>

</div>

  O/P :   Hello AngularJS. This is Example Of AngularJS ng-bind-template.

Example 2:

<div ng-app="webapp">

    <div ng-controller="angularjsexampleCtlr" ng-init="mycount=1">

        <div>

            <div ng-bind-template="{{myexpression}}{{yourexpression}}"></div>

        </div>

    </div>

</div>

   O/P :   Hello AngularJS. This is Example Of AngularJS ng-bind-template.

<script>

    angular.module('webapp', []).controller('angularjsexampleCtlr', function ($scope, $http) {

        $scope.myexpression = 'Hello AngularJS.';

        $scope.yourexpression = 'This is Example Of AngularJS ng-bind-template.';

    });

</script>