Question

如何根据值更改css引导程序的类

如果值确定，我想以绿色显示div，否则为红色。如果status =“ OK”，则它应该为<div class="small-box bg-green"> 其他<div class="small-box bg-red">

  <div class="col-lg-3 col-xs-6">
            <div class="small-box bg-green">
                <div class="inner">
                    <h3>No-7 @Model[4].status </h3>
                    <p>@Model[4].devEUI.Substring(4)</p>
                    <p>@Model[4].datetime</p>
                </div>
                <div class="icon">
                    <i>
                        <img src="~/images/TransIcon.png" />
                    </i>
                </div>
                <a href="@Url.Action("7", "Transformer")" class="small-box-footer">Trans info <i class="fa fa-arrow-circle-right"></i></a>
            </div>
        </div>

Answer 1

使用class="small-box @(@Model[4].status=='ok' ? "bg-green" : "bg-red")"

  <div class="col-lg-3 col-xs-6">
            <div class="class="small-box @(@Model[4].status=='ok' ? "bg-green" : "bg-red")">
                <div class="inner">
                    <h3>No-7 @Model[4].status </h3>
                    <p>@Model[4].devEUI.Substring(4)</p>
                    <p>@Model[4].datetime</p>
                </div>
                <div class="icon">
                    <i>
                        <img src="~/images/TransIcon.png" />
                    </i>
                </div>
                <a href="@Url.Action("7", "Transformer")" class="small-box-footer">Trans info <i class="fa fa-arrow-circle-right"></i></a>
            </div>
        </div>

Answer 2

您可以使用表达式

<div class="small-box @(Model[4].status == "ok" ? "bg-green" : "bg-red")">

如何根据来自模型的值更改div类

2 个答案: