var SomeController = function () {
this.customHtml = '<ul><li>render me please</li></ul>';
}<div ng:bind="customHtml"></div><div>
"<ul><li>render me please</li></ul>"
</div>对于 Angular 1.x，在 HTML 中使用ng-bind-html ：
<div ng-bind-html="thisCanBeusedInsideNgBindHtml"></div>此时，您将attempting to use an unsafe value in a safe context错误中attempting to use an unsafe value in a safe context因此您需要使用ngSanitize或$ sce来解决该问题。
在控制器中使用$sce.trustAsHtml()转换 html 字符串。
$scope.thisCanBeusedInsideNgBindHtml = $sce.trustAsHtml(someHtmlVar);分两个步骤：
包括 angular-sanitize.min.js 资源，即：
<script src="lib/angular/angular-sanitize.min.js"></script>
在 js 文件（控制器或通常为 app.js）中，包含 ngSanitize，即：
angular.module('myApp', ['myApp.filters', 'myApp.services', 'myApp.directives', 'ngSanitize'])
您还可以创建一个过滤器，如下所示：
var app = angular.module("demoApp", ['ngResource']);
app.filter("trust", ['$sce', function($sce) {
return function(htmlCode){
return $sce.trustAsHtml(htmlCode);
}
}]);然后在视图中
<div ng-bind-html="trusted_html_variable | trust"></div>注意 ：此过滤器信任传递给它的所有 HTML，并且如果将带有用户输入的变量传递给它，则可能呈现 XSS 漏洞。
上面链接中提供的解决方案对我有效，该线程上的所有选项均无效。对于使用 AngularJS 1.2.9 版寻找相同事物的任何人
这是副本：
好的，我找到了解决方案：
JS：
$scope.renderHtml = function(html_code) { return $sce.trustAsHtml(html_code); };HTML：
<p ng-bind-html="renderHtml(value.button)"></p>
编辑：
设置如下：
JS 档案：
angular.module('MyModule').controller('MyController', ['$scope', '$http', '$sce',
function ($scope, $http, $sce) {
$scope.renderHtml = function (htmlCode) {
return $sce.trustAsHtml(htmlCode);
};
$scope.body = '<div style="width:200px; height:200px; border:1px solid blue;"></div>';
}]);HTML 档案：
<div ng-controller="MyController">
<div ng-bind-html="renderHtml(body)"></div>
</div>幸运的是，您不需要任何奇特的过滤器或不安全的方法来避免出现该错误消息。这是完整的实现，可以以预期的安全方式在视图中正确输出 HTML 标记。
清理模块必须包含在 Angular 之后：
<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.2.26/angular.js"></script>
<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.2.26/angular-sanitize.js"></script>然后，必须加载模块：
angular.module('app', [
'ngSanitize'
]);这将允许您将标记包括在来自控制器，指令等的字符串中：
scope.message = "<strong>42</strong> is the <em>answer</em>.";最后，在模板中，必须这样输出：
<p ng-bind-html="message"></p>这将产生预期的输出： 42是答案 。
我今天尝试过，我发现的唯一方法是
<div ng-bind-html-unsafe="expression"></div>
ng-bind-html-unsafe不再起作用。
这是最短的方法：
创建一个过滤器：
myApp.filter('unsafe', function($sce) { return $sce.trustAsHtml; });在您看来：
<div ng-bind-html="customHtml | unsafe"></div> PS 此方法不需要您包括ngSanitize模块。
在 HTML 上
<div ng-controller="myAppController as myCtrl">
<div ng-bind-html-unsafe="myCtrl.comment.msg"></div>要么
<div ng-bind-html="myCtrl.comment.msg"></div在控制器上
mySceApp.controller("myAppController", function myAppController( $sce) {
this.myCtrl.comment.msg = $sce.trustAsHtml(html);还可以与$scope.comment.msg = $sce.trustAsHtml(html);
我发现使用 ng-sanitize 不允许我在 html 中添加 ng-click。
为了解决这个问题，我添加了一条指令。像这样：
app.directive('htmldiv', function($compile, $parse) {
return {
restrict: 'E',
link: function(scope, element, attr) {
scope.$watch(attr.content, function() {
element.html($parse(attr.content)(scope));
$compile(element.contents())(scope);
}, true);
}
}
});这是 HTML：
<htmldiv content="theContent"></htmldiv>祝好运。
只是通过遵循angular（v1.4）docs使用 ngBindHtml 做到了这一点，
<div ng-bind-html="expression"></div>
and expression can be "<ul><li>render me please</li></ul>"确保在模块的依赖项中包括 ngSanitize。然后它应该工作正常。
与 blrbr 的解决方案非常相似的另一种解决方案是，除了使用范围限定的属性外：
angular.module('app')
.directive('renderHtml', ['$compile', function ($compile) {
return {
restrict: 'E',
scope: {
html: '='
},
link: function postLink(scope, element, attrs) {
function appendHtml() {
if(scope.html) {
var newElement = angular.element(scope.html);
$compile(newElement)(scope);
element.append(newElement);
}
}
scope.$watch(function() { return scope.html }, appendHtml);
}
};
}]);接着
<render-html html="htmlAsString"></render-html>请注意，您可以将element.append()替换为element.replaceWith()