因爲 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 »</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 »</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 »</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 »</a></p> </div> </div> <footer> <p>© @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中引用的不統一問題。