关于angular中innerHTML需要二次刷新或者CSS样式不显示的问题

关于angular中innerHTML需要二次刷新或者CSS样式不显示的问题

ng里面inner HTML需要二次刷新是因为Angular中默认将所有输入值视为不受信任，解决方法如下
但是如果用的地方较多的话，我们用自定义管道（pipe）来优化以上代码，使用ng generate pipe safe-html命令来生成一个pipe，并做适当的修改：

// 对safe-html.pipe.ts做适当修改

import {Pipe, PipeTransform} from ‘@angular/core’;
import {DomSanitizer} from ‘@angular/platform-browser’;
@Pipe({name: ‘safeHtml’})
export class SafeHtmlPipe implements PipeTransform {
constructor(private sanitized: DomSanitizer) {
}
transform(value) {
return this.sanitized.bypassSecurityTrustHtml(value);
}
}

// 在使用innerHTML标签的属性里使用以上safeHtml管道