asp.net-mvc - 根据数据库值更改行颜色

Question

我将任务存储在数据库中。每个任务都可以解决或打开，因此我根据状态创建了一个isSolved包含true或false在数据库中的列。

现在我想显示所有任务的列表，并将已解决任务的行的背景颜色设置为绿色，将未解决的任务设置为红色。但是我怎样才能在.cshtml文件中实现这一点？

Answer 1

您可以使用@()来在视图内进行条件检查。

<ul>
 @foreach(var task in Model) // Model is your list of tasks
 {
  <li class="@(task.isSolved ? "solved" : "unsolved")">@task.Description</li>
 }
<ul>

CSS

li.solved
{
   color: green;
}

li.unsolved
{
  color: red;
}

Answer 2

根据状态为每个元素添加一个类。假设您正在渲染TaskVM主 VM 中的列表（我使用ul标签，但它适用于任何其他标签）：

<ul>
 @foreach(var task in Model.Tasks)
 {
  <li class="@task.Color" >text</li>
 }
<ul>

您的TaskVM.Color财产将类似于

public string Color
{
 get { return isSolved ? "Green" : "Red"; }
}

当然，你有一个 CSS 规则：

.Green {
 background-color:#33CC00;
}
.Red {
 background-color:#FF333;
}