Question

我有一个解决方案，使用AngularJS指令让html理解我的标签粗体作为html标签 b 。因此，当我在范围内使用textWorks时，<bold>{{testWorks}}</bold>会将文本设置为粗体。

但是，当{{testText}}位于范围内时，它不起作用：$scope.testText = "<bold>Peter</bold>";

当我使用ng-bind-html让值被视为html时，它也不起作用，您可以从Plunker找到代码

是否可以在评估表达式之前应用该指令？

Answer 1

为了将某些html绑定到角度变量，您必须使用$ sce模块来验证内容。

现场样本： http://plnkr.co/edit/NBFsepObvv5IujigTosK?p=preview

.controller('myController', ['$scope', '$sce', function($scope, $sce) {
    $scope.testText = $sce.trustAsHtml("<bold>Peter</bold>");

}]);

Answer 2

您可能需要将控制器更改为以下

.controller('myController', ['$scope', '$sce', function($scope, $sce) {
      $scope.testWorks = 'John';
      $scope.testText = $sce.trustAsHtml("<bold>Peter</bold>");
      $scope.testTable = [$sce.trustAsHtml('<bold>A</bold>'), $sce.trustAsHtml('<bold>B</bold>'), $sce.trustAsHtml('<bold>C</bold>')];
    }]);

你html到：

<tr>
    <td ng:repeat="data in testTable" ng-bind-html="data"> </td> 
</tr>

here is an example

Answer 3

感谢 Polochon 和 rishal ，我使用了$sce.trustAsHtml($compile("<bold>A</bold>")($scope).html()。您可以在此处找到它：Plunker

表中自定义html标记的Angular指令

3 个答案: