timhaak timhaak - 3 months ago 49
AngularJS Question

How do you use $sce.trustAsHtml(string) to replicate ng-bind-html-unsafe in Angular 1.2+

ng-bind-html-unsafe
was removed in Angular 1.2

I'm trying to implement something where I need to use
ng-bind-html-unsafe
. In the docs and on the github commit they say:


ng-bind-html provides ng-html-bind-unsafe like behavior (innerHTML's the result without
sanitization) when bound to the result of $sce.trustAsHtml(string).


How do you do this?

Answer

That should be:

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

plus in your controller:

$scope.html = '<ul><li>render me please</li></ul>';
$scope.trustedHtml = $sce.trustAsHtml($scope.html);

instead of old syntax, where you could reference $scope.html variable directly:

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

As several commenters pointed out, $sce has to be injected in the controller, otherwise you will get $sce undefined error.

 var myApp = angular.module('myApp',[]);

 myApp.controller('MyController'['$sce', function($sce) {
    // ... [your code]
 }]);
Comments