Skip to content
Related Articles

Related Articles

Improve Article
How to use AngularJS to Display HTML content value ?
  • Last Updated : 13 Mar, 2020

The ng-bind-html Directive is used to bind the innerHTML of an HTML element to application data and remove dangerous code from the HTML string. $sanitize service is a must for ng-bind-html directive. It is supported by all HTML elements.

Syntax:

<element ng-bind-html="expression"> Contents... </element>

Approach:

  • Initialize the libraries that we are using. Here, we are mainly use angular-sanitize.js library.
  • Create app and its controller scope.
  • Define the contoller variable.
  • Call the app and controller to body of html.
  • Inside the body use span tag and use attribute ng-bind-html and assign the value as the scope variable.

Example:




<html>
<head>
    <meta charset="utf-8">
</head>
<body ng-app="myApp" ng-controller="myCtrl">
    <span ng-bind-html="message"></span>
  
    <script src=
                charset="utf-8">
         </script>
    <script src=
                charset="utf-8">
</script>
    <script type="text/javascript">
    var app=angular.module('myApp',['ngSanitize']);
    app.controller('myCtrl',function($scope){
        $scope.message = '<h1>GeeksforGeeks</h1>';
    });
    </script> 
</body>
</html>

Output:

My Personal Notes arrow_drop_up
Recommended Articles
Page :