28
<h1>{{ revision.title }}</h1>

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

标题输出正常,但内容 - 没有。它里面有一些 html,我收到以下错误:Attempting to use an unsafe value in a safe context.被描述为:http ://docs.angularjs.org/error/ $sce:unsafe 很好,但是我怎样才能输出那里的内容里面会有一些html,所以我必须将它设置为{{ revision.content | safe }}或smthn。正确的方法是什么?

编辑:

AngularJS 版本:1.2

4

5 回答 5

110

所以修复是这样的:

包含angular-sanitize.min.js来自http://code.angularjs.org/并将其包含在您的模块中:

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

然后你就可以自由使用了ng-bind-html

于 2013-11-04T15:02:36.143 回答
4

我知道这是一个较老的问题,但您也可以信任$sce控制器中使用的值:

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

之后,ng-bind-html将工作。

于 2016-04-11T13:37:51.050 回答
3

我创建了一个ng-html指令,它执行与过去相同的基本ng-bind-html-unsafe操作。但是,我强烈建议您谨慎使用它。它很容易让您的网站受到恶意攻击。所以在你实施它之前知道你在做什么:

.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);
            }
        });
    };
}]);

然后你会用它作为:

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

希望有帮助。

于 2013-11-04T15:02:34.757 回答
2

你用的是什么版本?如果您使用的版本低于 1.2,您可以尝试ngBindHtmlUnsafe

于 2013-11-04T14:43:38.060 回答
0

根据Official AngularJs Doc,ngBindHtml您必须将ngSanitize注入您的应用程序依赖项

评估表达式并将生成的 HTML 以安全的方式插入到元素中。默认情况下,生成的 HTML 内容将使用 $sanitize 服务进行清理。要利用此功能,请确保 $sanitize 可用,例如,将 ngSanitize 包含在模块的依赖项中(而不是核心 Angular)。为了在模块的依赖项中使用 ngSanitize,您需要在应用程序中包含“angular-sanitize.js”。

然后您可以ngSanitize通过以下方式安装模块:

1 - 使用凉亭

bower install --save angular-sanitize

2 - 使用npm

npm install --save angular-sanitize

3 - 通过从 code.angularjs.org 路径手动下载angular-sanitize.js文件,其中包括所有 angularJs 文件类别按版本号,如@Xeen 答案

从官方 angularJs github 存储库中查看有关安装ngSanitize模块的更多信息,以安装 angular-sanitize

于 2016-11-07T20:43:39.613 回答