razor - 如何在 Razor MVC 4 中添加具有条件值的第二个 css 类

Question

虽然 Microsoft 已经创建了一些 automagic rendering of html attributes在 Razor MVC4 中，我花了很长时间才弄清楚如何基于条件 Razor 表达式在元素上呈现第二个 css 类。我想和你分享。

基于模型属性@Model.Details，我想显示或隐藏列表项。如果有细节，应该显示一个div，否则应该隐藏。使用 jQuery，我需要做的就是分别添加一个类显示或隐藏。出于其他目的，我还想添加另一个类，“细节”。所以，我的标记应该是:

<div class="details show">[Details]</div>或 <div class="details hide">[Details]</div>

下面，我展示了一些失败的尝试(结果标记假设没有细节)。

这个:<div @(@Model.Details.Count > 0 ? "class=details show" : "class=details hide")> ,

将呈现:<div class="details" hide=""> .

这个:<div @(@Model.Details.Count > 0 ? "class=\"details show\"" : "class=\"details hide\"")> .

将呈现:<div class=""details" hide&quot;=""> .

这个:<div @(@Model.Details.Count > 0 ? "class='details show'" : "class='details hide'")>

将呈现:<div class="'details" hide&#39;=""> .

这些都不是正确的标记。

Answer 1

我相信观点仍然存在有效的逻辑。但是对于这种事情我同意@BigMike，最好放在模型上。话虽如此，可以通过三种方式解决问题:

你的答案(假设这行得通，我还没试过):

<div class="details @(@Model.Details.Count > 0 ? "show" : "hide")">

第二个选项:

@if (Model.Details.Count > 0) {
    <div class="details show">
}
else {
    <div class="details hide">
}

第三种选择:

<div class="@("details " + (Model.Details.Count>0 ? "show" : "hide"))">