Asp.Net MVC 视图(使用TagBuilder类创建HTML Helpers)
ASP.NET MVC框架包含了一个有用的实用工具类，叫做TagBuilder类，你可以在创建HTML helpers的时候使用它。TagBuilder类，如其类名所暗示的，允许你轻松地创建HTML标签。在这个简短的教程中，将会为你提供一个TagBuilder类的概览，并且会学习到在创建一个简单的、呈现HTML<img>标签的HTML Helper时，如何来使用这个类。
1.TagBuilder类概览
TagBuilder类包含在System.Web.Mvc命名空间中。它含有5个方法：
- AddCssClass() – 允许你向标签添加一个新的 class = "" 属性。
- GenerateId() - 允许你为标签添加一个id属性。这个方法自动替换id中的句点（默认情况下，句点将会替换为下划线）。
- MergeAttribute() - 允许你为标签添加属性。这个方法拥有大量的重载。
- SetInnerText() - 允许你设置标签内部的文本。内部文本自动进行了HTML编码。
- ToString() - 允许你呈现标签。你可以指定是否想要创建一个正常的标签、一个开始标签、一个结束标签，或者一个自闭合（self-closing）标签。
TagBuilder类拥有四个重要的属性：
- Attributes - 代表这个标签的所有属性。
- IdAttributeDotReplacement - 代表GenerateId()方法所使用的，用来替代句点的字符（默认是下划线）。
- InnerHTML - 代表着标签内部的内容。将一个字符串赋值给这个属性，并不会对这个字符进行HTML编码。
- TagName - 代表着这个标签的名称。
这些方法和属性为你提供了所有的基础方法和属性，你需要使用它们来构建一个HTML标签。你并不是一定要使用TagBuilder类。你也可以使用StringBuilder类。然而，TagBuilder类将会让你的生活更加轻松一点儿。
2.创建一个Image HTML helper
当你创建一个TagBuilder类的实例的时候，你将想要创建的标签的名字传递给TagBuilder构造函数。接下来，你可以调用像AddCssClass()和MergeAttribute()这样的方法来更改标签的属性。最后，你调用ToString()方法来呈现标签。
举个例子，代码清单1包含了一个Image HTML helper。Image helper内部是由一个代表着HTML <img>标签的TagBuilder实现的。
代码清单1 - Helpers\ImageHelper.cs
using System.Web.Mvc;
using System.Web.Routing;
namespace MvcApplication1.Helpers
{
public static class ImageHelper
{
public static string Image(this HtmlHelper helper, string id, string url, string alternateText)
{
return Image(helper, id, url, alternateText, null);
}
public static string Image(this HtmlHelper helper, string id, string url, string alternateText, object htmlAttributes)
{
// Create tag builder
var builder = new TagBuilder("img");
// Create valid id
builder.GenerateId(id);
// Add attributes
builder.MergeAttribute("src", url);
builder.MergeAttribute("alt", alternateText);
builder.MergeAttributes(new RouteValueDictionary(htmlAttributes));
// Render tag
return builder.ToString(TagRenderMode.SelfClosing);
}
}
}
代码清单1中的类包含两个静态的重载方法，叫做Image。当你调用Image()方法时，你可以传递一个对象，该对象代表一系列的HTML属性。
注意到TagBuilder.MergeAttribute方法是如何用来添加独立属性，例如src 属性，到TagBuilder的。注意，除此以外，MergeAttributes()方法是如何添加属性集合到TagBuilder的。MergeAttributes()方法接受一个Dictionary<string, object>参数。RouteValueDictionary类用于将代表着属性集合的对象转换为一个Dictionary<string, object>。
在你创建好了Image helper之后，你可以再你的ASP.NET MVC视图中使用这个helper，就像使用其他任何标准的HTML helpers一样。代码清单2中的视图使用了这个Image helper来显示两次同一Xbox图片。调用Image()helper时含有或者不含有HTML属性集合。
代码清单2 - Home\Index.aspx
<%@ Page Language="C#" MasterPageFile="~/Views/Shared/Site.Master" Inherits="System.Web.Mvc.ViewPage" %>
<%@ Import Namespace="MvcApplication1.Helpers" %>
<asp:Content ID="indexContent" ContentPlaceHolderID="MainContent" runat="server">
<!-- Calling helper without HTML attributes -->
<%= Html.Image("img1", ResolveUrl("~/Content/XBox.jpg"), "XBox Console") %>
<!-- Calling helper with HTML attributes -->
<%= Html.Image("img1", ResolveUrl("~/Content/XBox.jpg"), "XBox Console", new {border="4px"})%>
</asp:Content>
图1：使用Image Helper
注意到你必须在Index.aspx视图的顶部引入与Image helper关联的命名空间。helper使用下面的指示符进行了引入：
<%@ Import Namespace="MvcApplication1.Helpers" %>