Angular interpolation syntax

What is an Angular interpolation directive?

In AngularJs while we use any expression we write them in double curly braces “{{ }}” so this double curly braces is also known as interpolation directive.

Example,

<!DOCTYPE html>
<html>

<head>
  <script data-require="angular.js@1.5.x" src="https://code.angularjs.org/1.5.8/angular.js" data-semver="1.5.8"></script>
  <script src="https://code.angularjs.org/1.4.0-rc.2/angular-sanitize.js"></script>
  <script>
    var app = angular.module("myApp", ["ngSanitize"]);

    app.controller("myCtrl", ["$scope", "$interpolate", function($scope, $interpolate) {

      var myname = {
        name: "<strong>Anil Singh</strong>"
      };

      var templateText = "Hello my name is {{name}} !";
      
      $scope.result = $interpolate(templateText)(myname);

    }]);
  </script>
</head>

<body ng-app="myApp" ng-controller="myCtrl">
  <div ng-bind-html="result"></div>
  <br/><a href="http://www.code-sample.xyz/2015/03/angularjs-documentation.html">For more..</a>
</body>

</html>

Live output,

About Blogger

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

Angular interpolation syntax

About Blogger

1 comments:

Video Of Day