環境說明

1. Angular 16 / typescript
2. .NET core web API
3. PostgreSQL

問題

使用者可輸入具有格式的文章內容content並進行保存，當時特地選用了能保存格式的資料庫PostgreSQL，在後端把文章內容(content)get出來並console在瀏覽器時，也能看到是具有格式的，但在前端html部分沒辦法顯示出格式。

有上網查到sanitizer.bypassSecurityTrustHtml 方法可以繞過瀏覽器對於 [innerHTML]的安全性檢查，但也無效，以下提供程式碼及畫面：

1. 前端HTML:

<p [innerHTML]="OneArticleDatas.content"></p>

2. 後端TS:

OneArticleDatas:any;
  /**
    * 取單一文章data
    *
    * @return {obj} article datas 
  */
  getOneArticleData(a_id:string) {
    this.HttpApiService.getOneArticleRequest(a_id).subscribe(
      res => {
        this.OneArticleDatas = res
        console.log("取單一文章data",this.OneArticleDatas)

        //繞過angular對innerHTML預設的安全性限制
        this.OneArticleDatas.content = this.sanitizer.bypassSecurityTrustHtml(this.OneArticleDatas.content) as SafeHtml;
        //列印檢查格式是否存在
        console.log("content",this.OneArticleDatas.content);
      }
    )
  }

3. F12 console
   
4. 前端畫面

• 輸入時有給予格式，編輯時也有get content並在textarea顯示，也具有格式
  
• 唯獨前端的無法正確顯示格式