6. ASP.NET MVC 5.0 中的HTML Helper【HTML 幫助類】
這篇文章，我將帶領大家學習HTML Helper。【PS：上一篇--> 5.ASP.NET MVC 中的Area【區域】是什麼 】
HTML Helpers是用來建立HTML標籤進而建立HTML控制元件的。HTML Helper僅僅是一個返回HTML字串的方法。ASP.NET MVC 中有三種HTML Helpers ：
1.Inline HTML Helper(內聯HTML Helper):主要是通過使用Razor語法中的@helper標記來建立。內聯HTML Helper僅僅只能在同一個檢視中，被重複使用。如果想要在所有的檢視中都能使用，有辦法可以解決。待會會介紹。
2.Built-In-HTML Helpers(內建的HTML Helpers)：這類的HTML Helper是HtmlHelper類的擴充套件方法，進一步分為3類：
2.1 標準HTML Helper【Standard HTML Helpers】 ：用來建立最常用得HTML標籤。
2.2 強型別的HTML Helpers【Strongly Typed HTML Helpers】 ：這種是HTML通過Model類的屬性生成，使用Lambda表示式來生成HTML。
2.3 模板化的HTML Helpers 【Templated HTML Helpers】:這種helper生成的HTML取決於Model類的屬性。
3.自定義的HTML helpers【Custom HTML Helpers】:你可以通過使用HtmlHelper擴充套件方法，或者在工具類中使用靜態方法來建立自定義的helper 方法。
1.先來看看內聯的HTML Helper。
建立專案HTMLHelpersWithMVC，同時新建一個Home控制器，和Index檢視：
檢視頁面：
執行一下：【效果圖】
現在假如，我還有一個Test頁面，也要顯示這個，怎麼辦呢？我們直接在Test頁面寫一下看看：
看，報錯了噢，內聯方法只能在宣告的檢視頁面使用噢，怎麼辦呢？我們可以這樣做：
右鍵專案建立一個App_Code資料夾：
在App_Code資料夾下，建立一個分佈檢視：
然後，把剛才在Home控制器Index頁面的內聯Html Helper方法宣告全部弄過來：
然後執行專案：看：
咋回事還是報錯了，現在Index頁面也報錯了，哪裡出問題了？？？
我們這樣改：把App_Code資料夾下的檢視頁面，屬性改成嵌入的資源和如果較新則複製
然後檢視頁面修改如下：
然後接著執行看看兩個頁面的效果：
看這樣就實現了，可以在多個頁面實現【內聯HTML Helpers】Inline HTML Helpers了。
2.1 現在來看看，內建的HTML Helpers中的標準 HTML Helpers了。
執行效果如下：
2.2 現在開始學習 【Built-In HTML Helpers】內建的HTML之強型別HTML Helpers了：
在Models資料夾下建立一個UserInfo類
為了演示這個強型別的，我新建一個控制器Account，並建立Index檢視：
執行程式：
2.3 現在看看模板化的HTML Helpers怎麼做 ：
我們在Account控制器中，新增一個Temp方法：並建立Temp檢視：
執行到Temp頁面：
發現@Html.EditorForModel()自動為我們建立了控制元件 。
3.最後我們來看看，怎麼建立自定義HTML Helpers
建立一個Custom控制器：
建立一個CustomClass:
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;
namespace HTMLHelpersWithMVC.Common
{
public static class CustomClass
{
/// <summary>
/// 擴充套件方法實現方式--建立提交按鈕
/// </summary>
/// <param name="helper">擴充套件類物件</param>
/// <param name="name">按鈕名稱</param>
/// <param name="value">按鈕值</param>
/// <returns></returns>
public static MvcHtmlString CreateSubmit(this HtmlHelper helper, string name, string value)
{
var btn = "<input type='submit' name='"+name+"' value='"+value+"'/>";
return new MvcHtmlString(btn);
}
/// <summary>
/// 靜態類實現方式--建立提交按鈕
/// </summary>
/// <param name="name">按鈕名稱</param>
/// <param name="value">按鈕值</param>
/// <returns></returns>
public static MvcHtmlString CreateSubmit(string name, string value)
{
var btn = "<input type='submit' name='" + name + "' value='" + value + "'/>";
return new MvcHtmlString(btn);
}
}
}
注意這個類CustomClass類必須要在 程式根目錄下建立 ，在檢視中才能點出來【有智慧提示】
正確的：
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;
namespace HTMLHelpersWithMVC
{
public static class CustomClass
{
/// <summary>
/// 擴充套件方法實現方式--建立提交按鈕
/// </summary>
/// <param name="helper">擴充套件類物件</param>
/// <param name="name">按鈕名稱</param>
/// <param name="value">按鈕值</param>
/// <returns></returns>
public static MvcHtmlString CreateSubmit(this HtmlHelper helper, string name, string value)
{
string btn = "<input type='submit' name='" + name + "' value='" + value + "'/>";
return new MvcHtmlString(btn);
}
/// <summary>
/// 靜態類實現方式--建立提交按鈕
/// </summary>
/// <param name="name">按鈕名稱</param>
/// <param name="value">按鈕值</param>
/// <returns></returns>
public static MvcHtmlString CreateSubmit(string name, string value)
{
string btn = "<input type='submit' name='" + name + "' value='" + value + "'/>";
return new MvcHtmlString(btn);
}
}
}
在Custom控制器的Index檢視中：
執行程式：
好了，這篇文章到此為止就介紹完了，ASP.NET MVC HTML Helpers了，學會了麼？