問題：使用innerHtml屬性賦值一段html片段時，片段中的樣式css會被忽略。

解決：可使用DomSanitizer將其轉化一下。這裡定義了一個pipe，具體如下：

import { Pipe, PipeTransform } from "@angular/core";
import { DomSanitizer } from '@angular/platform-browser';

// https://angular.io/guide/security
@Pipe({ name: 'safeHtml' })
export class SafeHtmlPipe implements PipeTransform {
  constructor(private sanitized: DomSanitizer) { }

  transform(value) {
    return this.sanitized.bypassSecurityTrustHtml(value);
  }
}
 

則可以實現對展示內容的自定義樣式。

  htmlStr = `
    <h1>innerHtml內容</h1>
    <h2 style="color: #1b75bb;">樣式自定義</h2>
  `

<div [innerHtml]="htmlStr | safeHtml"></div>

結果：