json..view中的HTML标签使用angularjs

Question

这是我的json数据

[{"Country" : "Germ<sup>any</sup>"},{"Country" : "Swe<sup>den</sup>"}]

以下是我使用angular js

获取它的方法

<div ng-app="" ng-controller="customersController"> 
<ul><li ng-repeat="x in names">{{ x.Country }}</li></ul>
</div>

和控制器脚本

function customersController($scope,$http){
$http.get("http://localhost/sample.php").success(function(response) {$scope.names = response;});
}

---

我得到的输出是

<ul>
<li>Germ&lt;sup&gt;any&lt;/sup&gt;</li>
<li>Sweden</li>
 </ul>

但我想要的输出是

<ul>
<li>Germ<sup>any</sup></li>
<li>Swe<sup>den</sup></li>
</ul>

需要帮助来解决这个问题......

Answer 1

您需要对要尝试打印HTML内容的div使用ng-bind-html。

有关详细信息，请参阅this link并相应更改代码。

Answer 2

默认情况下，AngularJS会清理您的数据并删除所有HTML。

要实现您的目标，请使用$sce服务将数据标记为受信任，并使用ngBindHtml指令将其绑定到视图，如下所示：

添加新过滤器

app.filter('unsafe', ['$sce', function($sce) {
    return function(text) {
        return $sce.trustAsHtml(text);
    };
}])

在HTML中使用

<ANY ng-bind-html="data | unsafe"></ANY>