AngularJs - html渲染

我们使用弹性搜索荧光笔，并从荧光笔中获取以下代码。AngularJs - html渲染

<span style='font-weight:bold;color:red;'>Baskar</span> Test

在html中显示结果如下。

     <tr 
         ng-repeat="result in searchModelResult">       
         <td><p ng-bind-html="result.name"></p></td>      
        </tr>

我已经包含sanitize.js并且在angular模块中有ngSanitize。仍然我没有看到像红色字体和粗体字体的HTML效果。

我在这里失踪了吗？

感谢， Baskar.S

来源

2015-05-07 user1578872

你需要做两件事情，首先删除

{{result.name}}

丹尼尔说...那么你需要说的角度在HTML在你的控制器信任：

myApp.controller('MyCtrl', function ($scope, $sce) { 
    $scope.result.name = $sce.trustAsHtml('<span style="font-weight:bold; color:red;">Baskar</span> Test'); 
});

你可以看到$ sce的完整文档here

如果您需要在ng-repeat内迭代，您可以创建一个过滤器：

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

，然后用它的观点：

<tr ng-repeat="result in searchModelResult">       
    <td><p ng-bind-html="result.name | unsafe"></p></td>      
</tr>

来源

2015-05-07 17:40:24

嗨，我得到一个列表，并在html中使用ng-repeat迭代。我是否应该在控制器中迭代列表并为每个元素添加$ sce.trustAsHtml？ – user1578872

不一定，你可以创建一个过滤器，如Chris在这个链接中所说：http://stackoverflow.com/questions/18340872/how-do-you-use-sce-trustashtmlstring-to-replicate-ng-bind-html-不安全在Angu看到第二个答案（一个女巫有306点）。告诉我你是否需要一个例子。 –

@ user1578872我举了一个答案的例子。 –

您需要删除第二个绑定表达式：

{{result.name}}

看起来是重写从ng-bind-html结合，默认绑定将HTML转义字符串。

来源

2015-05-07 17:15:24

我尝试这样做。现在，我没有看到html标签。但我没有看到HTML效果。文字颜色仍为正常颜色，不是红色，而不是粗体。 – user1578872

AngularJs - html渲染

回答

相关问题