之前在项目中 有用到富文本编辑器 大部分富文本编辑器的本质是一段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 的博客 感谢