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

小编典典

all

虽然 Microsoft 在 razor MVC4 中创建了一些html
属性的自动渲染，但我花了很长时间才了解如何根据条件 razor
表达式在元素上渲染第二个 css 类。我想和你分享。

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

<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"="">。

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

将呈现这个：<div class="'details" hide'="">。

这些都不是正确的标记。

阅读 79

2022-07-17

共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"))">

2022-07-17