Question

我有一个链接到ViewModel的视图，我动态设置了多标签导航。一切都很好但是当类别ID是以活动状态中的第一个选项卡开始时，我无法写入if条件。

    <ul class="nav nav-tabs" data-tabs="tabs">
    @foreach (var item in Model.LesCategories)
{ 
        <li><a href="#tabs-@item.Id" data-toggle="tab">@item.Nom</a> </li>
}
</ul>
<div id="my-tab-content" class="tab-content">
    @foreach (var item in Model.LesCategories)
    {

        <div id="tabs-@item.Id" class=" tab-pane">
            <table>
                @foreach (var plat in Model.LesPlats)
                {
                    if (plat.Category.Id == item.Id)
                    { 
                    <tr>
                        <td>
                            @Html.DisplayFor(platItem => plat.Nom)
                        </td>
                        <td>
                            <div class="btn-group">
                                <a class="btn dropdown-toggle" data-toggle="dropdown" href="#">Action <span class="caret">
                                </span></a>
                                <ul class="dropdown-menu">
                                    <li><a href="/Plat/Edit/@item.Nom">Modifier</a></li>
                                    <li><a href="/Plat/Details/@item.Nom">Détails</a></li>
                                    <li><a href="/Plat/Delete/@item.Nom">Supprimer</a></li>
                                </ul>
                            </div>
                        </td>
                    </tr>
            }

        }
            </table>
        </div>
        <p>
        </p>
}

</div>

Answer 1

我正在回答我自己的问题：这只是Razor理解基本问题：

<ul class="nav nav-tabs" data-tabs="tabs">

    @foreach (var item in Model.LesCategories)
{ 
        <li class="@(item.Id == 1 ? "active" : "")"><a  href="#tabs-@item.Id" data-toggle="tab" >@item.Nom</a> </li>
}
</ul>

正确选择标签，但不显示标签内容.....：）

Answer 2

我修改了我的代码，可能我的剃刀代码可以改进，但它可以工作

@{
    var tabActive = "";
<div id="my-tab-content" class="tab-content">
    @foreach (var item in Model.LesCategories)
    {

        if (item.Id == 1)
        {
            tabActive = "active"; 
        }
        else
        {
            tabActive = ""; 
        }


      <div id="tabs-@item.Id" class=" tab-pane @tabActive">
            <table>
                @foreach (var plat in Model.LesPlats)
                {
                    if (plat.Category.Id == item.Id)
                    { 
                    <tr>
                        <td>
                            @Html.DisplayFor(platItem => plat.Nom)
                        </td>
                        <td>
                            <div class="btn-group">
                                <a class="btn dropdown-toggle" data-toggle="dropdown" href="#">Action <span class="caret">
                                </span></a>
                                <ul class="dropdown-menu">
                                    <li><a href="/Plat/Edit/@item.Nom">Modifier</a></li>
                                    <li><a href="/Plat/Details/@item.Nom">Détails</a></li>
                                    <li><a href="/Plat/Delete/@item.Nom">Supprimer</a></li>
                                </ul>
                            </div>
                        </td>
                    </tr>
                    }

                }
            </table>
        </div>
        <p>
        </p>
        }

</div>
    }

动态组成的Asp.net MVC4 Bootstrap选项卡：如何设置具有活动类的第一个项目

2 个答案: