Menu
Handlebar's {{expression}} form HTML-escapes values returned while its {{{expression}}} form does not. Is there any way to add this feature to AngualarJS templates so that we can use {{expression}} for regular sanitized output and {{{expression}}} for trusted, non-escaped HTML expressions?
By the way, I am familiar with ng-bind-html directive.
989
Answer: The short answer is no. I've never come across such a configuration. You can't get {{{}}} to work in Angular.
Helpful workaround: It is not possible to get unescaped/unsanitized HTML into a view through the scope without using the ng-bind-html directive. You could add either a helper function to your controller or add a filter that might make it a little easier to use ng-bind-html (Plunk here), but you still seem to need ng-bind-html:
var app = angular.module('plunker', ['ngSanitize']);
app.controller('MyController', function($scope, $sce) {
$scope.someHtmlContent = "Label: <input name='test'>";
$scope.h = function(html) {
return $sce.trustAsHtml(html);
};
});
app.filter('trustAsHtml', function($sce) { return $sce.trustAsHtml; });
Then you would use it like this:
<body ng-controller="MyController">
<div ng-bind-html="someHtmlContent | trustAsHtml">
</div>
<div ng-bind-html="h(someHtmlContent)">
</div>
</body>
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
