在 mat-table 单元格内插入换行符或替换文本中的 html 标签

Question

我们的旧网站从数据库中获取数据，并且在文本中有 HTML 标签，这些标签正在格式化网站中的文本。我解释一下。

当我调用数据库以获取字段 INFO 的文本时。文本是：

"List of available city:<br>1-Boston<br>2-Washington<br>3-Miami... etc"

所以在我使用 table 时的旧站点是这样的：

<table>...
  <td><%= INFO %> </td>

所以该网站正在格式化 TD 字段中的文本，并在 table 的单元格字段中给出城市列表，如下所示：

List of available city:
1-Boston
2-Washington
3-Miami

现在我们正在使用 Angular 和 Mat-Table 创建一个新站点。信息来自同一个数据库，其中的文本已经用一些 HTML 标签进行了格式化。

如果我使用此代码：

      <table>
        <tr *ngFor="let rule of element.Reglements">
          <td class="line_rules">{{ rule.Reglement }}</td>
        </tr>
      </table>

不幸的是，单元格中的结果给出了包含 HTML 标签的文本，如下所示：

"List of available city:<br>1-Boston<br>2-Washington<br>3-Miami... etc"

问题：如何格式化我的 Table 单元格以使用 HTML 标签？

我是否需要为其他内容更改 HTML 标签？（我可以直接修改数据库或循环遍历字段并在将数据传递到 table ?

之前替换代码

有没有办法在文本单元格中插入换行符？

谢谢

Answer 1

我找到了可以做到这一点的东西。我的代码是：

  <table>
    <tr *ngFor="let rule of element.Reglements">
      <td class="line_rules">{{ rule.Reglement }}</td>
    </tr>
  </table>

我是这样做的：

<table>
    <tr *ngFor="let rule of element.Reglements">
          <td class="line_rules" [innerHTML]="rule.Reglement"></td>
    </tr>

在 mat-table 单元格内插入换行符或替换文本中的 html 标签

insert line feed inside mat-table cell or replace html tags in text

cell

angular-material

mat-table