AngularJS和材料图标

Question

材料图标在我的AngularJS应用程序中正常工作。

在我template.html：

<i class="material-icons">&#xE86A;</i> 

这工作得很好，正确显示的图标。

但是这个代码不：

<div ng-repeat="x in pages"> 
    current icon : {{x.icon}} 
    <br> 
    <i class="material-icons">{{x.icon}}</i> 
</div> 

页地方在控制器中定义为：

$scope.pages = [ 
{icon: ""}, 
{icon: ""}, 
{icon: ""} 
]; 

我可以看到正确的价值{{x.icon}}。

为什么

<i class="material-icons">{{x.icon}}</i> 

不行？

Answer 1

使用ng-bind-html和不安全的过滤器：

templat.html

JS

app.filter('unsafe',function($sce){ 
    return $sce.trustAsHtml 
})