Html 如何动态合并表格中的单元格

我想将单元格合并到表中，我知道最明显的方法-使用rowspan属性

 <table>
   <tr>
      <th rowspan="2">data</th>
      <td>
        first_data_element: 1 second_data_element: "abc"
      </td>
    </tr>
    <tr>
      <td>
        first_data_element: 2 second_data_element: "xyz"
      </td>
    </tr>
  </table>

数据
第一个数据元素：第二个数据元素：“abc”
第一个数据元素：第二个数据元素：“xyz”

然而，事实上，我的表是动态创建的-单元格内容是从数据库中获取的-因此我必须使用*ngFor指令

<table>
  <tr>
      <th rowspan="2">data</th>
      <td *ngFor="let el of data.dataElement">
        species: {{el.firstDataElement}} weight: {{el.secondDataElement}}
      </td>
    </tr>
</table>

数据
种类：{el.firstDataElement}}重量：{{el.secondDataElement}

但是这不起作用， 请注意，rowspan的值是永久输入的。

---

我需要的是

您需要在Angular中使用属性绑定，以便动态设置值，如下所示：

<th [attr.rowspan]="data.dataElement.length">data</th>

数据

请在此处找到doucmentation：

---

请在此处找到正在工作的stackbitz:

它仍然无法正常工作，数据彼此相邻显示，其他数据放在另一列中。您可以创建一个基本stackblitz或创建一个基本图片，说明您需要它。我更新了我的帖子，如果添加此属性，则不会发生任何更改，th元素在一列中，数据元素彼此相邻-在th元素的右侧很好，谢谢，我把*ngFor lopp放错了位置很乐意帮助：）