Open In App
Related Articles

How to insert HTML into view from AngularJS controller?

Improve Article
Save Article
Like Article

The ng-bind-html directive is a secure way of binding content to an HTML element. So in order to insert HTML into view, we use the respective directive.

While using AngularJS, write HTML in our corresponding application, we should check the HTML for dangerous or error prone code. By including the “angular-sanitize.js” module in the application we can do so by running the HTML code through the ngSanitize function.


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

It constitutes of 2 steps:

  • Include the angular-sanitize.min.js resource,

    <script src="lib/angular/angular-sanitize.min.js"></script>

  • In a js file (controller or usually app.js), we must include ngSanitize,

    angular.module('myApp', ['myApp.filters', '', 
    'myApp.directives', 'ngSanitize'])


  • Expressions: Specifies an expression or the value for the evaluation.

Example 1:

<script src=
<script src=
    <div ng-app="myApp" 
        <p ng-bind-html="myText">
        var app = angular.module("myApp", ['ngSanitize']);
        app.controller("myCtrl", function($scope) {
            $scope.myText = "GeeksForGeeks: <h1>Hello!</h1>";
    <p><b>Note:</b> This example includes the "angular-sanitize.js",
      which has functions for removing potentially 
      dangerous tokens from the HTML.</p>


Example 2:

<!DOCTYPE html> 
<html ng-app="myApp"
    <title>ng-bind-html Directive</title
    <script src
    <script src
        .green { 
            color: green; 
            font-size: 20px; 
<body ng-controller="geek" style="text-align:center"
    <h1 style="color:green;">GeeksforGeeks</h1
    <h2 style="">ng-bind-html Directive</h2
    <p ng-bind-html="text"></p
        var myApp = angular.module("myApp", ['ngSanitize']); 
        myApp.controller("geek", ["$scope", function($scope) { 
            $scope.text = 
            "<span class='green'> GeeksforGeeks</span> is the" 
            + " computer science portal for geeks."; 


Last Updated : 19 Feb, 2020
Like Article
Save Article
Similar Reads
Related Tutorials