c# - Razor View 上的 If 语句(对于 CSS 类)

Question

我需要根据是否阅读消息在 CSS 类之间切换。

简单来说应该是这样的:

if (item.status == "Unread")
{
  <tr style="font-weight:bold">
  ...
}
else
{
  <tr>
  ...
}

虽然我很难实现这一目标。有什么可以告诉我完成这项工作的好处吗？我应该使用 HTML 帮助器还是什么？

这是到目前为止的完整代码:

@foreach (var item in Model) {

    if (item.status == "Unread")
    {
        <tr style="font-weight:bold">
            <td>
                @Html.DisplayFor(modelItem => item.timestamp)
            </td>
            <td>
                @Html.DisplayFor(modelItem => item.subject)
            </td>
            <td>
                @Html.DisplayFor(modelItem => item.message_text)
            </td>
            <td>
                @Html.DisplayFor(modelItem => item.status)
            </td>
            <td>
                @Html.DisplayFor(modelItem => item.user_sender.username)
            </td>
            <td>
                @Html.DisplayFor(modelItem => item.user_reciever.username)
            </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>
    }
}

Answer 1

一个简单的解决方案是这样的:

@foreach (var item in Model) 
{
    var style = (item.status == "Unread") ? "font-weight:bold" : "";

    <tr style="@style">
        ...
    </tr>
}

但请注意，拥有一个单独的 CSS 类通常更简洁，然后根据其状态直接将元素装饰为适当的类。例如:

/* css */
tr.status-unread { font-weight: bold; }
...

/* razor */
@foreach (var item in Model) 
{
    <tr class="status-@item.status.ToLowerInvariant()">
        ...
    </tr>
}