Razor索引视图中的条件格式

时间:2012-03-14 17:26:10

标签: asp.net-mvc-3 razor

我正在尝试有条件地将CSS background-color添加到一组表行中,具体取决于项目的到期日期的接近程度。 30天或更短时间应为红色,90 - 31天为琥珀色,其余为绿色。 (我把红色放在第一位,一旦它工作,我会回去做琥珀色/绿色的行。)

@foreach (var item in Model)
{
    int daysLeft = (item.ExpiryDate - DateTime.Today).Days;

    if (daysLeft <= 30)
    { 
         <tr style="background-color:Red">
    }
    else
    {
        <tr>
    }

        <td>
            @Html.DisplayFor(modelItem => item.SupplierName)
        </td>
        <td>
            @Html.DisplayFor(modelItem => item.ExpiryDate)
        </td>
        <td>
            @Html.DisplayFor(modelItem => item.InceptionDate)
        </td>
        <td>
            @Html.DisplayFor(modelItem => item.Value)
        </td>
        <td>
            @Html.ActionLink("Edit", "Edit", new { id = item.Id }) |
            @Html.ActionLink("Details", "Details", new { id = item.Id }) |
            @Html.ActionLink("Delete", "Delete", new { id = item.Id })
        </td>
    </tr>
}

当我运行此页面时,我得到一个YSOD说@foreach块没有关闭它},但据我所知它们是匹配的所以我假设实际的问题是别的。

2 个答案:

答案 0 :(得分:41)

Razor要求代码块内部的标签平衡且格式良好 因此,第一个打开<tr>标记之后的所有代码实际上都会被解析为标记,因此最终的}只会关闭if

要解决此问题,您可以强制Razor通过在行前加@:来忽略该标记。

或者,你可以完全摆脱if并写下

string style = daysLeft <= 30 ? "background-color:Red" : null;
<tr style="@style">
    ...
</tr>

答案 1 :(得分:18)

使用条件运算符

博尔条件? true_expression false_expression ;

http://msdn.microsoft.com/en-us/library/ty67wk28(v=vs.80).aspx

@foreach (var item in Model)
{
    int daysLeft = (item.ExpiryDate - DateTime.Today).Days;

    <tr style="@(daysleft < 30 ? "Background-color:red" : "")">   
.....
}