Question

我有一个在视图中使用Razor的ASP.NET MVC应用程序。在我看来，我有以下内容：

<table style="width:100%;">
 ...
</table>

我想说，if (items.Count == 0)，然后表格的背景颜色应为橙色。但是，if (items.Count > 0)，我希望表格的背景颜色为灰色。我如何使用Razor做到这一点？

谢谢！

Answer 1

CSS：

.table {
    background-color: grey;
}
.table.empty {
    background-color: orange;
}

剃刀：

<table class="table @(items.Count == 0 ? "empty" : null)">

这将呈现为<table class="table">或<table class="table empty">。

一般来说，这些是关于核心值（null，""，true，false）如何在Razor的HTML属性中呈现的小规则：

Razor                    Rendered HTML
----------------------------------------
<abc xyz="s @(null) t">  <abcxyz="s t">
<abc xyz="@(null)">      <abc>
<abc xyz="@("")">        <abc xyz="">
<abc xyz="@(true)">      <abc xyz="xyz">
<abc xyz="@(false)">     <abc>

请注意null和""之间的差异（空字符串）。

正如Chris Pratt在评论中指出的那样，如果你不需要支持IE 9之前的版本，你可以使用:empty伪类来获得类似的效果而不需要三元运算符。

CSS：

.table {
    background-color: grey;
}
.table:empty {
    background-color: orange;
}

剃刀：

<table class="table">

Answer 2

只需再提供一个选项，您可以在页面开头设置颜色。

@{
    var color = items.Any() ? "#CCC" : "#FF0";
}

并在您的表格标签

<table style="color:@color"></table>

Answer 3

你可以使用三元运算符：

<table style='width:100%; @(items.Count > 0 ? "background-color: grey;" : "background-color: orange;" )'>
 ...
</table>

使用ASP.NET MVC进行条件格式化

3 个答案: