angular.module.ng.$compileProvider.directive.ng-bind-template

Description

The ng-bind-template attribute specifies that the element text should be replaced with the template in ng-bind-template. Unlike ng-bind the ng-bind-template can contain multiple {{ }} expressions. (This is required since some HTML elements can not have SPAN elements such as TITLE, or OPTION to name a few.)

Usage

as attribute
<ANY ng-bind-template="{string}">
   ...
</ANY>
as class
<ANY class="ng-bind-template: {string};">
   ...
</ANY>

Parameters

Example

Try it here: enter text in text box and watch the greeting change.

    <script>
      function Ctrl($scope) {
        $scope.salutation = 'Hello';
        $scope.name = 'World';
      }
    </script>
    <div ng-controller="Ctrl">
     Salutation: <input type="text" ng-model="salutation"><br>
     Name: <input type="text" ng-model="name"><br>
     <pre ng-bind-template="{{salutation}} {{name}}!"></pre>
    </div>
  
    it('should check ng-bind', function() {
      expect(using('.doc-example-live').binding('salutation')).
        toBe('Hello');
      expect(using('.doc-example-live').binding('name')).
        toBe('World');
      using('.doc-example-live').input('salutation').enter('Greetings');
      using('.doc-example-live').input('name').enter('user');
      expect(using('.doc-example-live').binding('salutation')).
        toBe('Greetings');
      expect(using('.doc-example-live').binding('name')).
        toBe('user');
    });