使用剃刀页面填充 html 表中的特定单元格

Question

在尝试用来自 MVC 模型的数据填充 html 表后，我们遇到了一个问题。 下面的代码生成一个表，它应该代表一个时间表。 第一行显示星期几，第一列显示上课时间的数字表示。

<table class="table2">
    <tr>
        <th></th>
        @{ string[] days = { "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday", "Sunday" };}

        @for (int i = 0; i < days.Length; i++)
        {
            <th>@(days[i])</th>
        }
    </tr>
    @{
        TimeSpan timeSpan = new TimeSpan(8, 30, 0); //08:30:00
        TimeSpan AddTime = new TimeSpan(0, 50, 0);  //00:50:00
        TimeSpan timeSpan2 = new TimeSpan();
    }

    @{ for (int i = 1; i < 16; i++)
        {


                <tr>
                    <td>
                        <h3>@(i)</h3>
                        <a>
                            @{timeSpan.ToString();}

                            @(string.Format("{0:00}:{1:00}", timeSpan.Hours, timeSpan.Minutes))
                        </a>
                        @{timeSpan2 = timeSpan.Add(AddTime);}
                        <div>
                            <a>
                                @(string.Format("{0:00}:{1:00}", timeSpan2.Hours, timeSpan2.Minutes))
                                @{timeSpan = timeSpan2;}
                            </a>
                        </div>
                    </td>
                    @foreach (var item in Model)
                    {
                        if (item.Hours.Contains(i))
                        {
                            for (int x = 0; x < days.Length; x++)
                            {
                                if (item.Day != days[x])
                                {
                                    <td>
                                    </td>
                                }
                                else
                                {
                                    <td>
                                        @(item.Class)
                                        @(item.Classroom)
                                    </td>
                                }
                            }
                        }
                    }
                </tr>
            }
    }
</table>

我们的模型看起来像这样；

public class ScheduleModel
{
    [Display(Name = "Lesson Code")]
    public string LessonCode { get; set; }
    [Display(Name = "Day")]
    public string Day { get; set; }
    [Display(Name = "Classroom")]
    public string Classroom { get; set; }
    [Display(Name = "Hours")]
    public int[] Hours { get; set; }
    [Display(Name = "Class")]
    public string Class { get; set; }
}

我会尝试解释我们正在尝试做的事情。 我们的视图获取了一个模型列表，其中填充了上面指定的数据。 我们想在上面尝试创建的 html 表中显示这些数据。 “Day”变量对应于表顶行中的天数，Hours int[] 对应于表第一列中的小时数。 应将这些值相互比较，以在表中找到正确的位置。 我们几乎让它工作了，上面显示了代码，但我们遇到了重复时间和空单元格的问题。

假设我们得到了模型的 2 个实例，一个看起来像这样；

Day : Monday
Hours : [1,2,3]

第二个看起来像这样：

Day : Tuesday
Hours: [1,2,3]

这个问题是foreach循环完全通过第一个模型，并用空单元填充第一行中的所有单元格，然后当foreach循环通过第二个模型时，它无法填充已经创建的空单元格，所以它只是把它们粘在最后； 屏幕截图以可视化问题；

所以这一切都归结为： 我们如何生成行，但我们仍然可以将新数据添加到空字段中。

Answer 1

这工作得很好！

 @for (int x = 0; x < 7; x++)
                            {
                                <td>
                                    @foreach(var item in Model)
                                    {
                                        if (item.Hours.Contains(i))
                                        {
                                            if(item.Day == days[x]){
                                                @(item.Class)
                                                @(item.Classroom)
                                            }
                                            else
                                            {
                                                @("")
                                            }
                                        }
                                    }
                                </td>
                            }