mvc4自定义辅助器方法的学习

1、什么是辅助器

　　它们可以对代码块和标记进行打包，以便能够在mvc框架应用程序中重用。可以理解成编写在页面上的C#代码（方法）。

2 、自定义辅助器

　创建“基本”的mvc示例，并创建Basic控制器，及index视图

Basic控制器

 public class BasicController : Controller
    {
        public ActionResult Index()
        {
            ViewBag.Fruits = new string[] { "苹果", "橘子", "梨子" };
            ViewBag.Citys = new string[] { "北京", "沈阳", "广州" };
            string message = "这是一个Html元素标签：<input>";
            return View((object)message);
        }
    }

Index页面

1）普通方式

     <div title="普通方式">
            <div>
                水果类：
                <ul>
                    @foreach (string str in (string[])ViewBag.Fruits)
                    {
                        <li>@str</li>
                    }
                </ul>
            </div>
            <div>
                城市类：
                <ul>
                    @foreach (string str in (string[])ViewBag.Citys)
                    {
                        <li>@str</li>
                    }
                </ul>
            </div>
            <div>
                信息:
                <p>@Model</p>
          </div>
      </div>

2）内联辅助器方法

内联辅助器具有方法名和参数，这个例子定义了ListArrayItems的辅助器，它是没有返回值，结果直接输出到客户端的响应中，只需要修改ListArrayItems里的内容即可。

定义辅助器方法

@helper ListArrayItems(string[] items) { 
    foreach (string str in items) {
        <li>@str</li>
    }
 }

页面调用

        <div title="内联辅助器">
            <div>
                水果类：
                <ul>
                    @ListArrayItems(ViewBag.Fruits)
                </ul>
            </div>
            <div>
                城市类：
                <ul>
                    @ListArrayItems(ViewBag.Citys)
                </ul>
            </div>
            <div>
                信息:
                <p>@Model</p>
            </div>
        </div>

3）外部辅助器方法

创建一个类文件

    public static class CustomHelpers
    {
        public static MvcHtmlString ListArrayItems(this HtmlHelper html, string[] list) {
            TagBuilder tag = new TagBuilder("ul");
            foreach (string str in list) {
                TagBuilder itemTag = new TagBuilder("li");
                itemTag.SetInnerText(str);
                tag.InnerHtml += itemTag.ToString();
            }
            return new MvcHtmlString(tag.ToString());
        }
    }

返回了 MvcHtmlString 类型，this HtmlHelper html 表示这是一个扩展方法，TagBulider创建html元素，不用使用大量转意符、尖括号等，非常方便。

调用外部辅助器首先要引用命名空间，然后调用方法如下：

引用命令空间

@using StudyMVC4.Helpers

  <div title="外部辅助器">
            <div>
                水果类：
                @Html.ListArrayItems((string[])ViewBag.Fruits)
            </div>
            <div>
                城市类：
                @Html.ListArrayItems((string[])ViewBag.Citys)
            </div>
            <div>
                信息:
                <p>@Model</p>
            </div>
        </div>

整合一下index页面

@{
    ViewBag.Title = "Index";
}
@helper ListArrayItems(string[] items) { 
    foreach (string str in items) {
        <li>@str</li>
    }
 }
@using StudyMVC4.Helpers
<!DOCTYPE>
<html>
    <head>
        <title>辅助器方法</title>
    </head>
    <body>
        <div title="普通方式">
            <h3>普通方式：</h3>
            <div>
                水果类：
                <ul>
                    @foreach (string str in (string[])ViewBag.Fruits)
                    {
                        <li>@str</li>
                    }
                </ul>
            </div>
            <div>
                城市类：
                <ul>
                    @foreach (string str in (string[])ViewBag.Citys)
                    {
                        <li>@str</li>
                    }
                </ul>
            </div>
            <div>
                信息:
                <p>@Model</p>
          </div>
      </div> 
        <hr />
        <div title="内联辅助器">
            <h3>内联辅助器：</h3>
            <div>
                水果类：
                <ul>
                    @ListArrayItems(ViewBag.Fruits)
                </ul>
            </div>
            <div>
                城市类：
                <ul>
                    @ListArrayItems(ViewBag.Citys)
                </ul>
            </div>
            <div>
                信息:
                <p>@Model</p>
            </div>
        </div>
        <hr />
        <div title="外部辅助器">
            <h3>外部辅助器：</h3>
            <div>
                水果类：
                @Html.ListArrayItems((string[])ViewBag.Fruits)
            </div>
            <div>
                城市类：
                @Html.ListArrayItems((string[])ViewBag.Citys)
            </div>
            <div>
                信息:
                <p>@Model</p>
            </div>
        </div>     
    </body>
</html>

3、运行结果

1）普通方式

2）内联辅助器

3）外部辅助器

mvc4自定义辅助器方法的学习

Guess you like