Javascript $sce.trustAsHtml无法按预期工作

以下是我正在尝试做的事情

$sce.trustAsHtml（“”）

在我的HTML代码中只打印

但是我希望在

$sce

返回属性之前对

ng class

属性进行评估。有点像这样，我的代码才能工作

---

如何做到这一点？

这是一个编译问题，当您呈现需要编译的动态内容时，$sce服务无法开箱即用。 您可以通过创建自己的指令强制编译来解决这个问题

app.directive('dynamic', function ($compile) {
      return {
        restrict: 'A',
        replace: true,
        link: function (scope, ele, attrs) {
          scope.$watch(attrs.dynamic, function(html) {
            ele.html(html);
            $compile(ele.contents())(scope);
          });
        }
      };
    })

    $scope.trustedContent = function(){
      return $sce.trustAsHtml('<span ng-class="getIconColor('+ myColor +')">');
    }

<div ng-bind-html="trustedContent()" dynamic> </div>

app.directive（'dynamic'，function（$compile）{
返回{
限制：“A”，
替换：正确，
链接：功能（范围、元素、属性）{
作用域.$watch（attrs.dynamic，函数（html）{
ele.html（html）；
$compile（ele.contents（））（范围）；
});
}
};
})
$scope.trustedContent=函数（）{
返回$sce.trustAsHtml（“”）；
}

---

解决方案1:-

在本例中，angularjs不编译。Angulajs不理解新指令的添加，他必须执行它。要运行case，您需要编译您的HTML。因此Angularjs将理解这一点，并提供您预期的输出

要实现这一点，您需要创建指令，该指令将编译HTML代码

解决方案2:-

---

您可以直接使用

$sce.trustAsHtml（“”）
为什么不直接使用
$sce.trustAsHtml（“”）
的可能重复项？是的。这是我想出的一个解决办法。但是还有一些其他的指令，比如工具提示，我不能在所有情况下都使用这个方法。我在寻找一个更通用的解决方案。然后您可以使用自定义指令来实现这一点。很高兴它有帮助：）