如何将HTML标签 等在一个DOM元素中绑定并且正常显示

问题描述：

比如我现在有个 $scope.data = "<span style='color:red;'>哈哈哈哈</span>";

这样一个变量，我想要随着我动态的改变它的值，然后再HTML页面上也动态的展现相同的被解释后的标签的样子。

这时候，如果采用 ng-model 或者 ng-bind 或者 {{}} 的话，内容将会被原样输出，即 <span style='color:red;'>哈哈哈哈</span>

这时候就需要采用 ng-bind-html来进行绑定，这样被绑定的内容在显示前会进行转义，但是问题又会出现，那就是标签的所有style属性都被过滤掉了，因为angular认为它们可能有风险，

解决方法：

那么为了显示这些style属性的话，就需要用$sce（angular原生自带）的trustAsHtml方法，$sce.trustAsHtml（$scope.data）这个方法的返回值再用ng-html-bind再去绑定的话就会进行显示。但是这个方法的返回值不再是string对象了，需要注意一下。