嵌套循环生成HTML表格时布局错乱问题求助

我现在碰到一个头疼的问题：用嵌套循环生成HTML表格的时候，表格布局完全乱掉了，实在搞不懂到底哪里出了问题。

一开始我以为是HTML或者CSS的问题，但琢磨了半天，越来越觉得可能是我的循环逻辑写得不对？

下面是我写的代码：

<table class="mb-5">
  <tr>
    <th>Code</th>
    <th>Vote</th>
  </tr>
  <ng-container>
    <tr *ngFor="let l of MET">
      <td>
        <ng-container *ngFor="let l of l.RESOLUTION">
          <tr>
            <td>{{ l.REF }}</td>
            <td>{{ l.ISSOUMISAUVOTE }}</td>
          </tr>
        </ng-container>
      </td>
    </tr>
  </ng-container>
</table>

我还做了个Demo来复现这个问题。

之前从来没遇到过这种情况，如果有人能帮我找到解决方案，我真的非常感激！

备注：内容来源于stack exchange，提问作者pops1348