javascript - 角度：创建没有 html 转义的格式化过滤器

Question

我想对某些字符串进行自动 html 格式化。例如，我想为带有下划线前缀的 char 做自动下标。
所以像 "U_1 + U_2 = U_3" 这样的字符串应该格式化为 U ₁ + U ₂ = U ₃

这看起来像是过滤器的完美工作。我尝试了以下方法：

angular.module('myApp.filters', []).
  filter('convert_subscripts', [ function(){
      return function(text){
          return text.replace(/_([\w]+)/, '<sub>$1</sub>', 'g');
      };
   }])

在我看来：

<p>{{content.text | convert_subscripts }}</p>

但这会转义 HTML，因此用户会看到“子”标签，而不是格式良好的下标。

如何实现格式化功能以使 html-Tags 不被转义？

（为了完美，应该对 content.text 本身进行转义以确保安全，但添加的下标标签不是。我使用 angular 1.2）

Answer 1

我认为这篇文章应该有所帮助。 您可以通过两种方式呈现 html

$sce.trustAsHtml('text')

或者您可以为此目的创建一个过滤器，例如

app.filter('filterName',function($sce){
    return function(text){
             $sce.trustAsHtml(text);
           }
    });

在您的情况下，您应该使用方法 1

function($sce){
      return function(text){
          return $sce.trustAsHtml(text.replace(/_([\w]+)/, '<sub>$1</sub>', 'g'));
      };