How to output html through AngularJS template? How to output html through AngularJS template? angularjs angularjs

How to output html through AngularJS template?


So the fix is this:

include angular-sanitize.min.js from http://code.angularjs.org/ and include it in your module:

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

and then you're free to use ng-bind-html


I know it's an older question, but you can also trust the value using $sce in your controller:

$scope.revision.content = $sce.trustAsHtml($scope.revision.content);

After that, ng-bind-html will work.


I created an ng-html directive that does the same basic thing that ng-bind-html-unsafe used to do. However, I strongly suggest that you only use it with caution. It could easily open your site up to malicious attacks. So know what you're doing before you implement it:

.directive('ngHtml', ['$compile', function($compile) {    return function(scope, elem, attrs) {        if(attrs.ngHtml){            elem.html(scope.$eval(attrs.ngHtml));            $compile(elem.contents())(scope);        }        scope.$watch(attrs.ngHtml, function(newValue, oldValue) {            if (newValue && newValue !== oldValue) {                elem.html(newValue);                $compile(elem.contents())(scope);            }        });    };}]);

And then you would use it as:

<div ng-html="revision.content"></div>

Hope that helps.