Angular 8

Angular 8 SafeHtml 用法

2019-03-12  本文已影响23人  bei6

Angular 中插入一段 HTML 代码的方式大多数都会采用管道的方式实现,下面是实现思路。

  1. 新建一个管道
    ng g pipe tohtml
    装饰器中标记了管道名称
@Pipe({
  name: "tohtml",
})
  1. 构造函数中注入Dom 消毒剂
constructor(
  private _sanitizer: DomSanitizer
) { }
  1. 在实现函数中完成自定义的转换
transform(value: string, args?: number): SafeHtml {
  let temp = '<b>' + value + '</b>';
  this._sanitizer.bypassSecurityTrustHtml(temp); // 标记这是一段可信的HTML
}
  1. 插入 HTML 的用法
<span [innerHTML]="content | tohtml"></span>
上一篇下一篇

猜你喜欢

热点阅读