你的問題是相當廣泛的創建模板。我所有的評論/答案將在Razor。在我看來,如果你要切換到MVC,你還可以使用Razor。有很多很好的理由可以改變,但我會說我的首選對於任何正在遷移的人來說,最好的理由是兩倍;第一個剃刀允許我放棄一些關於編程如何與webforms協作的壞習慣,並且在同一個莊園中,它迫使我重寫我的代碼,而不是嘗試複製和粘貼並將原始代碼更改爲在MVC中工作。
該控件向頁面添加一些JS/CSS,具有一些服務器端邏輯和自定義屬性。 MVC應用程序應該如何?
這是一個漂亮的religious software問題。有很多方法可以做到這一點。
因此,到我如何在MVC中添加JS/CSS的宗教觀點。包含服務器端的一種方法是在佈局/主模板中創建一個區域。
查看/ _ViewStart.cshtml
@{
Layout = "~/Views/Shared/Layout.cshtml";
}
查看/共享/ Layout.cshtml
<!doctype html>
<head>
<link href="/Styles/Global.css" rel="stylesheet" type="text/css" />
@RenderSection("Styles", required: false)
<script src="/Scripts/Global.js" type="text/javascript"></script>
@RenderSection("Scritps", required: false)
這將允許每個視圖任選地(因爲required=false
)添加任何樣式或腳本使用RenderSecion代碼。
查看/主頁/ Index.cshtml
@section Styles {
<link href="/Styles/Home/Index.css" rel="stylesheet" type="text/css" />
}
這是相當簡單的,對於許多簡單的適度複雜的網站可能是一個很好的解決方案。這對我來說還不夠,因爲我需要按照你的要求去做,而且只有在真正需要的時候才包含文件。此外,部分視圖和模板無法呈現部分,我發現它是一個巨大的PITA。所以我添加了一些HtmlHelper擴展方法。 (我只會顯示Javascript的代碼,因爲樣式表幾乎是相同的代碼,這些方法不允許重複的url。
Domain/HtmlHelperExtensions。CSHTML
public static class HtmlHelperExtensions
{
private const string _JSViewDataName = "RenderJavaScript";
private const string _StyleViewDataName = "RenderStyle";
public static void AddJavaScript(this HtmlHelper HtmlHelper, string ScriptURL)
{
List<string> scriptList = HtmlHelper.ViewContext.HttpContext.Items[HtmlHelperExtensions._JSViewDataName] as List<string>;
if (scriptList != null)
{
if (!scriptList.Contains(ScriptURL))
{
scriptList.Add(ScriptURL);
}
}
else
{
scriptList = new List<string>();
scriptList.Add(ScriptURL);
HtmlHelper.ViewContext.HttpContext.Items.Add(HtmlHelperExtensions._JSViewDataName, scriptList);
}
}
public static MvcHtmlString RenderJavaScripts(this HtmlHelper HtmlHelper)
{
StringBuilder result = new StringBuilder();
List<string> scriptList = HtmlHelper.ViewContext.HttpContext.Items[HtmlHelperExtensions._JSViewDataName] as List<string>;
if (scriptList != null)
{
foreach (string script in scriptList)
{
result.AppendLine(string.Format("<script type=\"text/javascript\" src=\"{0}\"></script>", script));
}
}
return MvcHtmlString.Create(result.ToString());
}
}
更新查看/共享/ Layout.cshtml
<!doctype html>
<head>
<link href="/Styles/Global.css" rel="stylesheet" type="text/css" />
@Html.RenderStyleSheets()
<script src="/Scripts/Global.js" type="text/javascript"></script>
@Html.RenderJavascripts()
更新查看/主頁/ Index.cshtml
@Html.AddStyleSheet("/Styles/Home/Index.css")
到您的下一個問題......
如何將這些東西封裝到MVC應用程序中的一個可重用實體中?也許是部分觀點?
Razor支持部分視圖和模板。雖然從技術上講,每種方法都有很大的重疊,但每種方法的設計都有一定的侷限性,以便程序員在需要時利用每種方法。
部分視圖做不是需要模型/類才能被渲染。這裏是一個完全有效的局部視圖:
/Views/Home/Index.cshtml
@Html.Partial("Partial-Menu")
/Views/Shared/Partial-Menu.cshtml
<div id="menu">
<a href="/">Home</a>
<a href="/Home/About">About Us</a>
</div>
模板上另一個,做需要一個模型才能被渲染。這是因爲模板是一種將任何類或結構渲染爲編輯模板或顯示模板的方法。
/Models/Person.cs
public class Person
{
public string FirstName { get; set; }
public string LastName { get; set; }
}
/Controllers/HomeController.cs
public ActionResult Index()
{
Person model = new Person();
model.FirstName = "Jon";
model.LastName = "Doe";
return this.View(model);
}
/Views/Home/Index.cshtml
@model Project1.Models.Person
@Html.DisplayModel()
@Html.EditforModel()
/Views/Shared/DisplayTemplates/Person.cshtml
@model Project1.Models.Person
<div>@Html.LabelFor(x => x.FirstName) @Html.DisplayFor(x => x.FirstName)</div>
<div>@Html.LabelFor(x => x.LastName) @Html.DisplayFor(x => x.LastName)</div>
/Views/Shared/EditorTemplates/Person.cshtml
@model Project1.Models.Person
<div>@Html.LabelFor(x => x.FirstName) @Html.EditorFor(x => x.FirstName)</div>
<div>@Html.LabelFor(x => x.LastName) @Html.EditrorFor(x => x.LastName)</div>
我看到它的方式,有可能將任何模型進入數據輸入表格應該可能是一個模板。這是我喜歡封裝我的模型的方式。使用前面提供的擴展方法,我的部分視圖和模板都可以根據需要加載包含(目前,我的模型實際上只需要使用它們中的一個)。
我的首選項是每個頁面最多包含三個包含(每個Javascript和樣式)。我基本上有一個Global.css/js,一個控制器Home.css/js和一個index.css/js頁面作爲可能包含的內容。包含控制器的情況很少見。
所有我能想到的是編寫一個自定義的jQuery插件,並做類似$(「input#myTextBox」)。makeSuggestable(); – Alex