之前在項目中 有用到富文本編輯器 大部分富文本編輯器的本質是一段HTML 項目中的需求是將這部分html 以瀏覽方式顯示出來
所以就想到了用innerHtml 但是實際用下去發現 html內容還在 但樣式消失了
后面去網上查了下資料 才發現是因為angular使用innerHtml時style行內樣式消失 大致原因是angular出於安全考慮
解決方案則是要使用angular的一個DOM解釋器 方式則是通過angular管道來對html進行格式化
代碼如下：
import {Pipe, PipeTransform} from "@angular/core";
import {DomSanitizer} from "@angular/platform-browser";
@Pipe({
name: "html"
})
export class HtmlPipe implements PipeTransform{
constructor (private sanitizer: DomSanitizer) {
}
transform(style) {
return this.sanitizer.bypassSecurityTrustHtml(style);
}
}
上文中提到的資料來源於：https://me.csdn.net/jokren 的博客 感謝