代码之家  ›  专栏  ›  技术社区  ›  Strider

在双大括号内呈现HTML

  •  0
  • Strider  · 技术社区  · 5 年前

    我在一个Ionic/Angular应用程序中使用了一个管道,它正在转换文本并返回带有html代码的结果。

    以下是我如何使用烟斗的示例:

    <ion-label>
      <span>{{ text | mypipe: 'lo':'secondary' }}</span>
    </ion-label>
    

    双卷曲中代码的HTML结果如下:

    Loth<ion-text color='secondary'>lo</ion-text>rien
    

    Loth<ion-text color='secondary'>lo</ion-text>rien 而不是大麻

    谢谢

    1 回复  |  直到 5 年前
        1
  •  1
  •   Ludevik    5 年前

    太长,读不下去了 :

    dynamically in runtime .

    <span [innerHTML]="text | mypipe: 'lo':'secondary'"></span>
    

    你的烟斗应该还回来 SafeHtml :

    @Pipe({
        name: 'mypipe'
    })
    export class MyPipe implements PipeTransform {
    
        constructor(private sanitizer: DomSanitizer) {}
    
        public transform(value, params): SafeHtml {
            //do whatever your pipe does and then
            return this.sanitizer.bypassSecurityTrustHtml(somethingToReturn);
        }
    }
    

    看到了吗 this question .

    您也可以编写通用管道,如 this article

    <span [innerHTML]="text | mypipe: 'lo':'secondary' | safe: 'html'"></span>
    

    但是,由于标记中包含另一个角度分量,所以它不起作用。它可以和标准版一起工作 html 标记。 你想寻找一种方法,不只是渲染 html格式 compile 动态创建模板并动态创建结果组件。有什么进展吗 these lines .