从_Layout.cshtml调用部分视图

时间:2018-01-03 06:22:22

标签: asp.net-mvc

我有一个主要类别,主要类别在数据库中有其子类别列表。所以它是一个关系数据库。为了更好地理解.edmx地图图片是附加的。现在我的目标是一个名为_GuestNav.cshtml的局部视图将包含类别和子类别列表显示,然后将从_Layout.cshtml调用此_GuestNav.cshtml。所以我从_Layout.cshtml调用部分视图,部分视图包含带foreach循环的动态数据。所以我想知道如何正确循环以显示_GuestNav.cshtml上的主类别和子类别?我已经尽力给你更好的理解但请问我有任何问题。

pic

控制器:

[ChildActionOnly]
        public PartialViewResult _GuestNav()
        {
            using (var db = new MyAppWebEntities())
            {
                return PartialView("_GuestNav", db.Categories.ToList());
            }
        }

_Layout.cshtml:

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>@ViewBag.Title</title>
    @Styles.Render("~/Content/css")
    @Scripts.Render("~/bundles/modernizr")

    @Scripts.Render("~/bundles/jquery")
    @Scripts.Render("~/bundles/bootstrap")

    <link href="~/Content/font-awesome.min.css" rel="stylesheet" />
    <script src="~/Content/sweetalert.min.js"></script>
    <script src='https://www.google.com/recaptcha/api.js'></script>
    @RenderSection("scripts", required: false)

</head>
<body>
    <nav class="navbar navbar-default navbar-fixed-top">
        <div class="container">
            <div class="container-fluid">
                <div class="navbar-header">
                    <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1">
                        <span class="sr-only">Toggle navigation</span>
                        <span class="icon-bar"></span>
                        <span class="icon-bar"></span>
                        <span class="icon-bar"></span>
                    </button>
                    <a class="navbar-brand" href="@Url.Action("Index", "Home")">My App <i class="fa fa-refresh" aria-hidden="true"></i></a>
                </div>

                <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
                    @Html.Partial("_GuestNav"); @* here i am calling partial view *@  
                </div>
            </div>
        </div>
    </nav>
    <div class="container body-content">
        @RenderBody()
        <hr />
        @Html.Partial("_Footer")
    </div>

</body>
</html>

_GuestNav.cshtml:

<ul class="nav navbar-nav">
    <li>@Html.ActionLink("Plans", "Plans", "Home")</li>

    @* Example of loop bellow *@
    @*@foreach (var allcat in allcats)
    {
        <li class="dropdown">
            <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="false">@allcat.MainCatName<span class="caret"></span></a>
            <ul class="dropdown-menu" role="menu">
                @foreach (var subcat in allcat.subcat)
                {
                    <li><a href="#">subcat.SubcatName</a></li>
                }
            </ul>
        </li>
    }*@

    @* Wanted output like bellow from database---> *@
    <li class="dropdown">
        <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="false">Main Cat 1<span class="caret"></span></a>
        <ul class="dropdown-menu" role="menu">
            <li><a href="#">Subcat</a></li>
            <li><a href="#">Subcat</a></li>
            <li><a href="#">Subcat</a></li>
            <li><a href="#">Subcat</a></li>
        </ul>
    </li>
    <li class="dropdown">
        <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="false">Main Cat 2<span class="caret"></span></a>
        <ul class="dropdown-menu" role="menu">
            <li><a href="#">Subcat</a></li>
            <li><a href="#">Subcat</a></li>
            <li><a href="#">Subcat</a></li>
            <li><a href="#">Subcat</a></li>
        </ul>
    </li>
</ul>

1 个答案:

答案 0 :(得分:1)

1.Change @Html.Partial("_GuestNav") to @{Html.RenderAction("_GuestNav", "YourControlerName");}

2.在部分视图之上添加@Model TypeofYourViewModel

3.更改循环如下:

@foreach (var item in Model)
    {
        <li class="dropdown">
            <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="false">@item.MainCatName<span class="caret"></span></a>
            <ul class="dropdown-menu" role="menu">
                @foreach (var subcat in item.subcat)
                {
                    <li><a href="#">subcat.SubcatName</a></li>
                }
            </ul>
        </li>
    }

注意:将TypeofYourViewModel更改为您传递到局部视图中的任何ViewModel