ngb popover 不渲染 html 编码

Question

我需要在 ngbPopover 中渲染一些文本，我可以做到。
这里的问题是我需要在文本之间换行。

我尝试使用
、\n、\u000A 对我来说没什么用
按原样显示，对于 \n 和 \u000A 我在屏幕上看不到任何效果。

以下是我的代码供参考。

html

<ng-template #subCoveragePopup>
   <div class="sub-coverage-tooltip">
      <div class="details">
        <div *ngFor="let subCov of getSubCoverageDescription(quoteCoverage.coverage)">
          <div class="title">{{subCov.code}}</div>
          <div class="">{{subCov.name}}</div>
        </div>
      </div>
   </div>
</ng-template>

inside subCov.name 我通过 angular ->

得到以下文本

Testing: this is line 1\u000A This is line 2

或

Testing: this is line \n This is line 2

或

Testing: this is line <BR> This is line 2

对于所有三个选项，我都无法显示换行符。有什么我想念的吗？

Answer 1

将css样式添加到相同的div:

<ng-template #subCoveragePopup>
   <div class="sub-coverage-tooltip">
      <div class="details">
        <div *ngFor="let subCov of getSubCoverageDescription(quoteCoverage.coverage)">
          <div class="title">{{subCov.code}}</div>
          <div class="splitLine">{{subCov.name}}</div>
        </div>
      </div>
   </div>
</ng-template>

.splitLine {
    style="white-space: pre;"
}

ngb popover 不渲染 html 编码

ngb popover not rendering html encoding

html-encode

ng-bootstrap

angular