Binding a html content in scope variable without using ng-bind-html

Question

How to bind html content using scope variable (without using ng-bind-html-unsafe) in angularjs

<div ng-controller="dataController">{{test}}</div>

$scope.test = "<div>Html content</div>"

according to my project guidelines ng-bind should not be used, is there any other way? jsbin.com/kuwovoxa/1/edit — user1153484
– user1153484, Commented Apr 5, 2014 at 19:23
according to your project guidelines then scope variables shouldnt contain html meant to be displayed. — mpm
– mpm, Commented Apr 5, 2014 at 19:34

Sai · Accepted Answer · 2014-04-05 19:56:43Z

3

This is what you are looking for:

function dataController($scope,$sce){
   $scope.test = "<div>Html content</div>";
   $scope.test = $sce.trustAsHtml($scope.test);
}

View

<div ng-bind-html="test"></div>

answered Apr 5, 2014 at 19:56

Sai

2,06819 silver badges26 bronze badges

Sign up to request clarification or add additional context in comments.

1 Answer 1