Question

我的$scope包含以下items

$scope.items= [
    { body : '<span> value </span>' },
    { body : '<span> whatever </span>' }
];

当我尝试

时

<li ng-repeat="item in items">{{item.body}}</li>

HTML输出是：

<li>&lt;span&gt; value &lt;/span&gt;</li>
<li>&lt;span&gt; whatever &lt;/span&gt;</li>

然后浏览器上显示的文字是这样的：

<span> value </span>
<span> whatever </span>

如何逃避跨度并将其解析为HTML？

修改：已接受答案中的链接不再适用于最新版本。目前this is how you do it

Answer 1

如果您完全确定您创建的代码不能包含来自用户数据的任何漏洞，请查看ngBindHtmlUnsafe：

http://docs.angularjs.org/api/ng.directive:ngBindHtmlUnsafe

如果您需要清理可能有害的html片段，请查看Sanitize模块中的ngBindHtml：

http://docs.angularjs.org/api/ngSanitize.directive:ngBindHtml

Answer 2

接受的答案中的链接不再适用于当前版本的Angular。如果你确定已经消毒了，你可以做这样的事情来禁用转义。更新了严格上下文转义的链接：https://docs.angularjs.org/api/ng/service/%24sce

var app = angular.module('search-app')
                 .config(['$sceProvider', function ($sceProvider) {
                     $sceProvider.enabled(false) ;// global override
                  }]);

   app.controller('SearchController', function ($scope, $http) {

   }

在AngularJS中输出ng-repeat内的HTML

2 个答案: