如何使用 MVC Razor 设置 html 属性，例如 class？答案

【问题标题】：How to set html attributes such as class using MVC Razor?如何使用 MVC Razor 设置 html 属性，例如 class？
【发布时间】：2012-03-29 22:49:26
【问题描述】：

when Razor如何设置html属性？

在下面的代码中，如果当前模型的“Succeeded”属性为真，我想设置元素的类属性。

<tbody>
                @foreach (CharlieTestRunViewModel charlieTestRunViewModel in Model)
    {
                    <tr class="@if(!@charlieTestRunViewModel.Succeeded){'trFailedTestRun'}">
                        <td>
                            @charlieTestRunViewModel.Succeeded
                        </td>
                                    </tr>
    }
            </tbody>

但它不起作用。

如何做到这一点？

谢谢

【问题讨论】：

标签： asp.net html asp.net-mvc class razor

【解决方案1】：

如何使用条件运算符：

<tr class="@(!charlieTestRunViewModel.Succeeded ? "trFailedTestRun" : "")">

如果：

<tr class="@if(!@charlieTestRunViewModel.Succeeded){<text>trFailedTestRun</text>}">

【讨论】：

+1 但请注意它是条件运算符。无论如何，这是我的首选，富有表现力。但其他人无疑会更喜欢 HtmlHelper 扩展。
@AndrasZoltan 好收获！我不知道我用错了运营商的名字:)
好吧，我想说我从来没有做过 - 但我会撒谎。它是 only 三元运算符并没有帮助！

【解决方案2】：

你可以用这个

你必须在你的视图之上引用你的模型，如下所示

@model charlieTestRunViewModel

【讨论】：

【解决方案3】：

我发现使用razor helper 最优雅

@helper ClassIf(bool condition, string className)
{
   if (condition)
   {
      @className
   }    
}

并像使用它

 <tr class="@MyHelpers.ClassIf(charlieTestRunViewModel.Succeeded, "trFailedTestRun")">

【讨论】：

【解决方案4】：

我会像这样为 HtmlHelper 创建一个扩展方法

public static MvcHtmlString GetFailedClass(this HtmlHelper html, bool condition)
    {
        if(!condition)
           return MvcHtmlString.Create("trFailedTestRun")
    }

然后在视野中

<tr class="@Html.GetFailedClass(charlieTestRunViewModel.Succeeded)">

【讨论】：