c# - ASP.NET MVC : Razor <tr> do not match close tag

Question

我有一个充满列表模型的模型，我想使用 foreach 循环来显示它，但是......我的 html 看起来像这样:

<tr>
    <td class="lottery-unit lottery-unit-0"><img src="~/images/temp/1.png"></td>
    <td class="lottery-unit lottery-unit-1"><img src="~/images/temp/2.png"></td>
    <td class="lottery-unit lottery-unit-2"><img src="~/images/temp/4.png"></td>
    <td class="lottery-unit lottery-unit-3"><img src="~/images/temp/3.png"></td>
</tr>
<tr>
    <td class="lottery-unit lottery-unit-11"><img src="~/images/temp/7.png"></td>
    <td colspan="2" rowspan="2">
        <a href="#"></a>
    </td>
    <td class="lottery-unit lottery-unit-4"><img src="~/images/temp/5.png"></td>
</tr>
<tr>
    <td class="lottery-unit lottery-unit-10"><img src="~/images/temp/1.png"></td>
    <td class="lottery-unit lottery-unit-5"><img src="~/images/temp/6.png"></td>
</tr>
<tr>
    <td class="lottery-unit lottery-unit-9"><img src="~/images/temp/3.png"></td>
    <td class="lottery-unit lottery-unit-8"><img src="~/images/temp/6.png"></td>
    <td class="lottery-unit lottery-unit-7"><img src="~/images/temp/8.png"></td>
    <td class="lottery-unit lottery-unit-6"><img src="~/images/temp/7.png"></td>
</tr>

lottery-unit lottery-unit-0 到 lottery-unit lottery-unit-11 是我想要显示的十一个 dto，而 tr 不固定。 如果我用 Razor 这样写:

foreach (var item in Model)
{
    if (item.Order >= 0 && item.Order <= 3)
    {
        if (item.Order == 0)
        {
            <tr>                                                
        }
        <td class="lottery-unit lottery-unit-0"><img src="~/images/temp/1.png"></td>
        @if(item.Order == 3)
        {
            </tr>
        }
    }

上面会出现一些错误。那么如何编写正确的代码呢？

Answer 1

您需要添加@在foreach前面并添加 @: 在<tr>前面和</tr>里面if声明。你的代码应该是这样的:

@foreach (var item in Model)
{
    if (item.Order >= 0 && item.Order <= 3)
    {
        if (item.Order == 0)
        {
            @:<tr>
        }
        <td class="lottery-unit lottery-unit-0"><img src="~/images/temp/1.png"></td>
        if (item.Order == 3)
        {
             @:</tr>
        }
    }
}