Question

我遇到了angularJs的问题。我的应用程序从服务器请求一些数据，并且从服务器返回的数据中的一个值是一串html。我在像我这样的角度模板中绑定它

<div>{{{item.location_icons}}</div>

但正如您所料，我看到的不是图标图像而是标记基本上div中的东西看起来像

 "<i class='my-icon-class'/>"

这不是我想要的。

任何人都知道我可以做什么来解析翻译中的html

Answer 1

您希望将ng-bind-html和ng-bind-html-unsafe用于此目的。

示例显示为here

Answer 2

由于不推荐使用ng-bind-html-unsafe，您可以改用此代码。

您需要在控制器内创建功能：

$scope.toTrustedHTML = function( html ){
    return $sce.trustAsHtml( html );
}

并在您的视图中使用类似的内容：

<span ng-bind-html='toTrustedHTML( myHTMLstring )'></span>

别忘了注入$ sce：

AppObj.controller('MyController', function($scope, $sce) {
    //your code here 
});

Answer 3

更好的方法是使用$compile代替ng-bind-html-unsafe。

最后，目前，angularJS的最新版本（发布候选版本1.2.0）没有任何ng-bind-html-unsafe指令。因此，我非常鼓励您在将来更新应用之前考虑此选项。（ng-bind-html-unsafe可能/将不再工作......）