我正在尝试使用 $sanitize 提供程序和 ng-bind-htm-unsafe 指令来允许我的控制器将 HTML 注入 DIV。
但是，我无法让它工作。
<div ng-bind-html-unsafe="{{preview_data.preview.embed.html}}"></div>
我发现这是因为它已从 AngularJS 中删除（谢谢）。
但是没有ng-bind-html-unsafe，我得到这个错误：
【问题讨论】：
你不需要在 ng-bind-html-unsafe 中使用 {{ }}：
<div ng-bind-html-unsafe="preview_data.preview.embed.html"></div>
这是一个例子：http://plnkr.co/edit/R7JmGIo4xcJoBc1v4iki?p=preview
{{ }} 运算符本质上只是 ng-bind 的简写，因此您尝试的内容相当于绑定中的绑定，这是行不通的。
【讨论】：
{{}} 运算符导致我的绑定失败问题，感谢您的提示！
您表示您正在使用 Angular 1.2.0...正如其他 cmets 之一所指出的那样，ng-bind-html-unsafe 已被弃用。
相反，您需要执行以下操作：
<div ng-bind-html="preview_data.preview.embed.htmlSafe"></div>
在您的控制器中，注入 $sce 服务，并将 HTML 标记为“受信任”：
myApp.controller('myCtrl', ['$scope', '$sce', function($scope, $sce) {
// ...
$scope.preview_data.preview.embed.htmlSafe =
$sce.trustAsHtml(preview_data.preview.embed.html);
}
请注意，您需要使用 1.2.0-rc3 或更高版本。 （他们在 rc3 中修复了 a bug，这会阻止“观察者”在受信任的 HTML 上正常工作。）
【讨论】：
myApp.controller('myCtrl', ['$scope', '$sce', function($scope, $sce) {
ngSanitize 的答案 (stackoverflow.com/a/25679834/22227)，以获得更安全的替代解决方案。
trustAsHtml 言行一致，它信任 any 传入的 html 代码，这可能导致跨站脚本 (XSS) 攻击
您可以创建自己的简单不安全的 html 绑定，当然如果您使用用户输入，则可能存在安全风险。
App.directive('simpleHtml', function() {
return function(scope, element, attr) {
scope.$watch(attr.simpleHtml, function (value) {
element.html(scope.$eval(attr.simpleHtml));
})
};
})
【讨论】：
$sce.trustAsHtml吗？
我也遇到过类似的问题。仍然无法从我托管在 github 上的 markdown 文件中获取内容。
在 app.js 中为 $sceDelegateProvider 设置白名单（添加了 github 域）后，它就像一个魅力。
说明：如果您从不同的 url 加载内容，则使用白名单而不是包装为受信任。
文档： $sceDelegateProvider 和 ngInclude（用于获取、编译和包含外部 HTML 片段）
【讨论】：
对我来说，最简单、最灵活的解决方案是：
<div ng-bind-html="to_trusted(preview_data.preview.embed.html)"></div>
并向您的控制器添加功能：
$scope.to_trusted = function(html_code) {
return $sce.trustAsHtml(html_code);
}
不要忘记将$sce 添加到控制器的初始化中。
【讨论】：
您可以将其转换为简单的过滤器，而不是像 Alex 建议的那样在您的范围内声明一个函数：
angular.module('myApp')
.filter('to_trusted', ['$sce', function($sce){
return function(text) {
return $sce.trustAsHtml(text);
};
}]);
然后你可以这样使用它：
<div ng-bind-html="preview_data.preview.embed.html | to_trusted"></div>
这是一个工作示例：http://jsfiddle.net/leeroy/6j4Lg/1/
【讨论】：
<td ng-bind-html="representative.primary | to_trusted"></td>
app 中包含ngSanitize 模块
例如：var app = angular.module('myApp', ['ngSanitize']);
ng-bind-html原来的html内容。无需在控制器中执行任何其他操作。解析和转换由ngBindHtml 指令自动完成。 （阅读How does it work 部分：$sce）。因此，在您的情况下，<div ng-bind-html="preview_data.preview.embed.html"></div> 会完成这项工作。【讨论】：
在我看来，最好的解决方案是：
创建一个自定义过滤器，例如可以在 common.module.js 文件中 - 在整个应用程序中使用：
var app = angular.module('common.module', []);
// html filter (render text as html)
app.filter('html', ['$sce', function ($sce) {
return function (text) {
return $sce.trustAsHtml(text);
};
}])
用法：
<span ng-bind-html="yourDataValue | html"></span>
现在 - 我不明白为什么指令 ng-bind-html 不将 trustAsHtml 作为其功能的一部分 - 对我来说似乎有点愚蠢，因为它没有
无论如何 - 我就是这样做的 - 67% 的时间，它永远有效。
【讨论】：
可以完全禁用严格的上下文转义，允许您使用ng-html-bind 注入 html。这是一个不安全的选项，但在测试时很有帮助。
来自AngularJS documentation on $sce的示例：
angular.module('myAppWithSceDisabledmyApp', []).config(function($sceProvider) {
// Completely disable SCE. For demonstration purposes only!
// Do not use in new projects.
$sceProvider.enabled(false);
});
将上述配置部分附加到您的应用程序将允许您将 html 注入ng-html-bind，但正如文档所述：
SCE 以极少的编码开销为您提供了许多安全优势。 申请 SCE 禁用申请将更加困难，并且 自行保护它或在稍后阶段启用 SCE。它可能使 在您拥有大量现有代码的情况下禁用 SCE 是有意义的 这是在引入 SCE 之前编写的，您正在迁移它们 一个模块。
【讨论】：
你可以像这样使用过滤器
angular.module('app').filter('trustAs', ['$sce',
function($sce) {
return function (input, type) {
if (typeof input === "string") {
return $sce.trustAs(type || 'html', input);
}
console.log("trustAs filter. Error. input isn't a string");
return "";
};
}
]);
用法
<div ng-bind-html="myData | trustAs"></div>
它可用于其他资源类型，例如 iframe 的源链接和声明为here 的其他类型
【讨论】：