Angularjs ng-bind-html-unsafe replacement

javascript angularjs binding ng-bind-html
Harry picture Harry · Sep 20, 2013 · Viewed 25.3k times · Source

I used to be able to use ng-bind-html-unsafe to output unsanitized code (because sanitization happens serverside).

But now that option is gone? I know I can use $sce.trustAsHtml but adding that to the JavaScript all over the place is a huge pain when unsafe was so easy to use.

How do I get unsafe back?

Answer

Matthew.Lothian picture Matthew.Lothian · Feb 24, 2014

Simpler again. 

App.filter('unsafe', ['$sce', function ($sce) {
    return function (val) {
        return $sce.trustAsHtml(val);
    };
}]);

Usage:

<any ng-bind-html="content | unsafe"></any>

For more on html binding check the docs here.

Just a warning: make sure you actually trust the html, or you could be opening a hole in your sites security.

Related questions

How to get evaluated attributes inside a custom directive

I'm trying to get an evaluated attribute from my custom directive, but I can't find the right way of doing it. I've created this jsFiddle to elaborate. <div ng-controller="MyCtrl"> <input my-directive value="123"> <input my-directive …

Read More
Angularjs Template Default Value if Binding Null / Undefined (With Filter)

I have a template binding that displays a model attribute called 'date' which is a date, using Angular's date filter. <span class="gallery-date">{{gallery.date | date:'mediumDate'}}</span> So far so good. However at the moment, …

Read More
Angular lazy one-time binding for expressions

AngularJS has a new feature since the version 1.3.0-beta.10: the "lazy one-time binding". Simple expressions can be prefixed with ::, telling angular to stop watching after the expression was first evaluated. The common example given is something like: <div>{{::…

Read More