Html 在“角度”中的“动态材质表”的列名中添加新行

我有一个带有动态列的材质表，当前看起来像-

但我的预期输出是这样的-

在引脚接地=1后，如何添加新线？我尝试添加BR，但没有成功

我生成动态列的代码是-

      <mat-table matSort [dataSource]="gridDataSource">
      <ng-container [matColumnDef]="col" *ngFor="let col of columnsToDisplay">
      <mat-header-cell mat-sort-header *matHeaderCellDef>
                  {{col | uppercase}}
      </mat-header-cell>
      <mat-cell *matCellDef="let element">
                  {{element[col]}}
      </mat-cell>
      </ng-container>
      <mat-header-row class="headerHeight" *matHeaderRowDef="columnsToDisplay"></mat-header-row>
      <mat-row *matRowDef="let row; columns: columnsToDisplay;"
      [ngClass]="row.SEQ % 4 == 0 ? 'rows' : 'row'"></mat-row>
      </mat-table>

{{col |大写}}
{{element[col]}

经过研究，我找到了解决办法

我们可以使用[innerHtml]属性代替{{colName}}。这使得字符串中的
标记反映为水平分隔线

<span [innerHTML]= "col | uppercase"></span>

---

您可以添加BR，并使用角度为的

raw

管道。应该打印html代码并将断点放在适当的位置。