In this example, We will create a panel using ng-bind-html. To achieve this, we have taken a scope variable with name panel and assigned the dynamic html to it like : $scope.panel = "

"; and then assign the variable to div model like:

<!DOCTYPE html> <html xmlns=""> <head> <title></title> <script src=""></script> <script src=""></script> <link rel="stylesheet" href=""> </head> <body ng-app="app"> <div ng-controller="myController"> <div class="container"> <div class="row well"> <div class="col-md-offset-2 col-md-8"> <div ng-bind-html="panel"></div> </div> </div> </div> </div> <script> var app = angular.module("app", ['ngSanitize']); app.controller('myController', ['$scope', '$sce', function ($scope, $sce) { $scope.panel = "<div class='panel panel-primary'><div class='panel-heading'>LearnIT</div>"; $scope.panel += "<div class='panel-body'>LearnIT is a website for Beginner and Professional to learn AngularJS step by step and the biggest advantage is that while learning you can experiment your code Online.</div></div>"; }]); </script> </body> </html>