角度/CSS表格格式。Div对象阻止表格式设置

这张桌子有问题:

  <table style="width: 100%">
    <tr>
      <th>Name</th>
      <th>Ref</th>
      <th>Res</th>
      <th>Pom</th>
    </tr>
    <div *ngFor="let set of ics">
      <tr>
        <td style="column-span: 4">{{set.section}}</td>
      </tr>
      <tr *ngFor="let ic of set.ic">
        <td>{{ic.name}}</td>
        <td>{{ic.ref}}</td>
        <td>{{ic.res}}</td>
        <td>{{ic.pom}}</td>
      </tr>
    </div>
  </table>

| Name             | ref | res | pom |
| section                            |
| d1               | 1   | 2   | 3   |
| d2               | 4   | 5   | 6   | 
| another section                    | 
| d1               | 7   | 8   | 9   |
| d2               | 10  | 11  | 12  |

但看起来是这样的:

| Name             | ref | res | pom |
| section |
| d1      | 1 | 2 | 3 |
| d2      | 4 | 5 | 6 | 
| another section |
| d1              | 7  | 8  | 9  |
| d2              | 10 | 11 | 12 |

我怀疑 <div> 对象阻止行看到 <部门>

我试过了 *ngFor <table> ,它确实有效,但我得到了 th 元素对每一组IC重复,我正试图消除混乱。