使用 angular 4 在 html table 中重复只有四列的行

Repeat row with only four columns in html table using angular 4

例如。我有一个这样的数组 cids:Array=[{Id:1},{Id:2},{Id:3},{Id:4},{Id:5},{Id:6},{Id :7}--------等..]

我希望输出为:

1 2 3 4
5 6 7 8
9 

在 angular 4

中使用 *ngFor
<span *ngFor="let cid of cids">
    {{cid.Id}}
    <br *ngIf="(cid.Id)%4==0" />
</span>

一种方法是将数组[] 转换为数组[][4]。然后你就可以使用一个嵌套的 ngFor(另一个 ngFor 中的 ngFor)

伪代码:

ngFor* {
   ngFor* {
      print value;
      insert a space;
   }
  Insert a return line;
}