Javascript 创建一行中包含两个不同数据的嵌套表

我正在构建一个具有相同列的嵌套表，但对于行，我必须每天插入2周的数据，如下面的屏幕截图所示：

我创建了简单的数据，并在第一周的工作时间后调用它，以便它们在一行中对齐，如下所示：

时间表时间
身份证件
类型
周一
星期二
结婚
星期四
星期五
全部的
{{item.id}
{{item.type}
{{项目.星期一}
{{项目.星期二}
{{项目.星期三}
{{项目.星期四}
{{项目.星期五}
{{item.total}

我会使用数组来存储每个工作日的值

{
        "id": 1, 
        "type": "math",
        "timeID": 2,
        "weekNumber": 1,
        "monday": ["10", "10"],
        "tuesday": ["10", "10"],
        "wednesday": ["10", "10"],
        "thursday": ["10", "10"],
        "friday": ["10", "10"],
        "total": ["40", "40"],
    }

这样，即使将来需要添加第三个值，也不需要在模型中添加其他属性

要在表中显示此信息，可以使用

*ngFor

指令，就像现在对行所做的一样

<tbody>
  <tr *ngFor="let item of filteredItems">
    ...

    <td>
      <ng-container *ngFor="let value of item.monday">
         <div>{{value}}</div>
      </ng-container>
    </td>

    ...           
  </tr>
</tbody>

...
{{value}}
...           

---

你可以在StackBlitz现场看到：

“更好”在旁观者眼中，问题中没有客观标准表明如何判断一个答案是正确的。这就是为什么这类问题通常是关于堆栈溢出的。也就是说，使用数组而不是编号属性通常是一个好主意。另外，

td

的

rowspan

属性正是屏幕截图所要求的。这就是我要问的问题，第一个问题是如何以其他方式显示数据，包括使用rowspan，rowspan重复前2列中的数据，鉴于我使用的是

*ngFor

条件，我不希望重复这些数据。第二，如果我能以更好的方式更改数据，而不是仅仅将两周的数据合并在一起。我不认为这个问题是离题的。Nikhil，谢谢你建议对json文件进行更改。我已更新了我的问题，并希望获得有关构建嵌套表的帮助。@TheUnKnown-我阅读了您编辑的问题。为了正确地对齐它们，我们需要对CSS进行一些更改。我正试着在电脑上复制这个。您还可以将

组件.ts

添加到问题中吗？或者至少为filteredItems添加一些值。@未知-谢谢添加它。看看这个。我使用的是回答中所述的数组，您可以看到所需的显示值。如果您可以将json数据转换为使用数组，那么您可以立即在StackBlitz中使用修改后的HTML。如果您有任何问题，请告诉我。是的，您可以使用

{{item.monday}{{item.monday2}}

而不是使用*ngFor。但我建议使用数组。