如何在PartialView中添加本身的引用信息

因为 PartialView 对与 @section 的方法是不支持的,所以咱们写在 PartialView 里面的内容没法进入到主页中,这就为PartialView 的使用带来了诸多不便,所以咱们要采用一种方法来加以实施,为系统使用带来方便。css

首先咱们要创建一个RunTime.CS文件html

public static class HtmlExtensions
{
    public static MvcHtmlString Import(this HtmlHelper htmlHelper, string section, string name, Func<object, HelperResult> template)
    {
        foreach (object key in htmlHelper.ViewContext.HttpContext.Items.Keys)
        {
            string[] keySection = key.ToString().Split(new char[] { '_' });
            if (keySection.Length == 3 && keySection[0] == "von" && keySection[2].Equals(name, StringComparison.OrdinalIgnoreCase))
                htmlHelper.ViewContext.HttpContext.Items.Remove(key);
        }
        htmlHelper.ViewContext.HttpContext.Items["von_" + section.ToLower() + "_IMPORT_" + name.ToLower()] = template;
        return MvcHtmlString.Empty;
    }

    public static IHtmlString RenderImports(this HtmlHelper htmlHelper, string section)
    {
        string sectionKey = "von_" + section.ToLower() + "_IMPORT_";
        foreach (object key in htmlHelper.ViewContext.HttpContext.Items.Keys)
        {
            if (key.ToString().StartsWith(sectionKey))
            {
                var template = htmlHelper.ViewContext.HttpContext.Items[key] as Func<object, HelperResult>;
                if (template != null)
                {
                    htmlHelper.ViewContext.Writer.Write(template(null));
                }
            }
        }
        return MvcHtmlString.Empty;
    }
}

这样咱们就能够完成引用信息的基础工做了,而后咱们写个例子测试一下:web

首先修改布局文件 _Layout.cshtml
c#

<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>@ViewBag.Title</title>
    @Html.RenderImports("header")
    
</head>
<body>
    @RenderBody()
    @Html.RenderImports("footer")
</body>
</html>

关注 一下这两句话,这是放置咱们应用内容的地方。app

@Html.RenderImports("header")
...
@Html.RenderImports("footer")

而后咱们修改 Index.cshtml 文件,这里面增长 PartialView 引用段落asp.net

@{
    ViewBag.Title = "Home Page";
}

<div class="navbar navbar-inverse navbar-fixed-top">
    <div class="container">
        <div class="navbar-header">
            <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
            </button>
            @Html.ActionLink("应用程序名称", "Index", "Home", new { area = "" }, new { @class = "navbar-brand" })
        </div>
        <div class="navbar-collapse collapse">
            <ul class="nav navbar-nav">
                <li>@Html.ActionLink("主页", "Index", "Home")</li>
                <li>@Html.ActionLink("关于", "About", "Home")</li>
                <li>@Html.ActionLink("联系方式", "Contact", "Home")</li>
            </ul>
            @Html.Partial("_LoginPartial")
        </div>
    </div>
</div>
<div class="container body-content">
    <hr />
    <div class="jumbotron">
        <h1>ASP.NET</h1>
        <p class="lead">ASP.NET is a free web framework for building great Web sites and Web applications using HTML, CSS and JavaScript.</p>
        <p><a href="http://asp.net" class="btn btn-primary btn-lg">Learn more &raquo;</a></p>
    </div>
    <div class="row">
        <div class="col-md-4">
            <h2>Getting started</h2>
            <p>
                @Html.Partial("../Test/A")
            </p>
            <p><a class="btn btn-default" href="http://go.microsoft.com/fwlink/?LinkId=301865">Learn more &raquo;</a></p>
        </div>
        <div class="col-md-4">
            <h2>Get more libraries</h2>
            <p>
                @Html.Partial("../Text/B")
            </p>
            <p><a class="btn btn-default" href="http://go.microsoft.com/fwlink/?LinkId=301866">Learn more &raquo;</a></p>
        </div>
        <div class="col-md-4">
            <h2>Web Hosting</h2>
            <p>

            </p>
            <p><a class="btn btn-default" href="http://go.microsoft.com/fwlink/?LinkId=301867">Learn more &raquo;</a></p>
        </div>
    </div>
    <footer>
        <p>&copy; @DateTime.Now.Year - 个人 ASP.NET 应用程序</p>
    </footer>
</div>

关注这里面的
布局

@Html.Partial("../Test/A")
...
@Html.Partial("../Test/B")

这里面分别引用了两个 PartialView 段落内容,而后咱们简单实现这两个 PartialView ,这是 Test/A.cshtml测试

//Test/A.cdhtml
@{
    Layout = null;
}
@Html.Import("header", "A_CSS", @<link rel="stylesheet" type="text/css" href="/content/A.css">)

<div>
<H1>This is Test A</H1>
</div>

@Html.Import("footer", "B_CSS", @<link rel="stylesheet" type="text/css" href="/content/B.css">)

这是Test/B.cshtmlui

//Test/B.cdhtml
@{
    Layout = null;
}
@Html.Import("header", "A_CSS", @<link rel="stylesheet" type="text/css" href="/content/A.css">)

<div>
<H1>This is Test A</H1>
</div>

@Html.Import("footer", "C_CSS", @<link rel="stylesheet" type="text/css" href="/content/C.css">)

Controller的实现我这里就不讲了,关键看执行的结果,哈哈!this

<head>
    ...
    <link rel="stylesheet" type="text/css" href="/content/A.css">
</head>
<body>
...
    <link rel="stylesheet" type="text/css" href="/content/B.css">
    <link rel="stylesheet" type="text/css" href="/content/C.css">
</body>

成功。这样就从更本上解决了 PartialView 引用以及Action中引用的不统一问题。

相关文章
相关标签/搜索