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

Question

我们的旧网站正在从数据库中获取数据，并且在文本中包含 HTML 标记，用于格式化网站中的文本。我解释。

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

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

所以在旧网站上当我使用我的桌子时是这样的：

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

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

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"

问题：如何格式化表格单元格以使用 HTML 标记？

我是否需要为其他内容更改 HTML 标签？（在将数据传递到表之前，我可以直接修改数据库或循环字段并替换代码吗？

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

谢谢

标签： angular-materialcellmat-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>