ng-bind-html剥离元素属性 [英] ng-bind-html strips elements attributes

问题描述

我正在尝试插入一个在模板中包含一些标记的字符串.

I'm trying to interpolate a string that contains some markup in a template.

在控制器中:
$scope.message = "Hello moto <a ui-sref='home.test'>click</a>";

In the controller:
$scope.message = "Hello moto <a ui-sref='home.test'>click</a>";

模板:

<div ng-bind-html="message.text"></div>

呈现为:

<div ng-bind-html="message.text" <div="" class="ng-binding">Hello moto <a>click</a></div>

尝试使用以下过滤器也无济于事；对于以下任何一个已选择的选项，该文本均被简单地转义:

Trying to use the following filter does not help either; the text is simpy escaped for either of the commented choices:

angular.module('test-filters', ['ngSanitize'])
    .filter('safe', function($sce) {
            return function(val) {
                return $sce.trustAsHtml(val);
                //return $sce.trustAsUrl(val);
                //return $sce.trustAsResourceUrl(val);
            };
    });

如何在不转义也不删除属性的情况下插补字符串?

How can I interpolate my string without escaping it nor stripping attributes?

Plunker http://plnkr.co/edit/H4O16KgS0mWtpGRvW1Es?p=preview (更新为引用ngSanitize的sylwester版本

Plunker http://plnkr.co/edit/H4O16KgS0mWtpGRvW1Es?p=preview (updated with sylwester's version that has reference to ngSanitize

推荐答案

在这里看看 http://jsbin.com/Faxopipe/1/edit 现在已排序. 它没有用，因为标签'ui-sref'中还有另一个指令， 因此您必须使用$ sce服务.

Let have a look here http://jsbin.com/faxopipe/1/edit it is sorted now. It didn't work because there was another directive inside a tag 'ui-sref', so you have to use $sce service.

在您的js中，请添加方法:

in your js please add method:

 $scope.to_trusted = function(html_code) {
    return $sce.trustAsHtml(html_code);

并在视野中:

<p ng-bind-html="to_trusted(message)"></p>

这篇关于ng-bind-html剥离元素属性的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！