如何在 MVC3 中使用 HTML 助手构建 html答案

【问题标题】：How to build html using HTML helpers in MVC3如何在 MVC3 中使用 HTML 助手构建 html
【发布时间】：2012-11-26 23:08:19
【问题描述】：

我有一个这样的助手，我在里面使用原始 HTML 创建了它，如下所示：

private static readonly Core Db = new Core();
        // Main menu
public static MvcHtmlString MainMenu()
{
    IQueryable<Page> primaryPages = Db.Pages.Where(p => p.IsItShowInMenu);
    var sb = new StringBuilder();
    sb.Clear();
     string pagecode = Convert.ToString(HttpContext.Current.Request.RequestContext.RouteData.Values["url"]);
    sb.Append("<div id=\"Logo\">");
    sb.Append("<a href=\"/\"><span id=\"Logo_Text\">Dr. Shreekumar</span></a> <span id=\"Logo_Sub_Text\">Obstetrician & Gynecologist</span>");
    sb.Append("</div>");
    sb.Append("<div id=\"Primary_Menu\">");
    sb.Append("<ul>");
    foreach (Page page in primaryPages)
    {
        if (page.PageCode != "Home")
        {
             Page currentPage = Db.Pages.SingleOrDefault(p => p.PageCode == pagecode);
             if (currentPage != null)
             {
                  Page parentPage = Db.Pages.Find(currentPage.ParentId);
                  if (parentPage != null)
                  {
                      sb.AppendFormat((page.PageCode == parentPage.PageCode ||
                      page.PageCode == currentPage.PageCode)
                      ? "<li class=\"active\"><a href=\"/pages/{0}\">{1}</a></li>"
                        : "<li><a href=\"/pages/{0}\">{1}</a></li>", page.PageCode,
                              page.Name.Trim());

                  }
                  else
                  {
                     sb.AppendFormat("<li><a href=\"/pages/{0}\">{1}</a></li>", page.PageCode,page.Name);
                  }
              }
              else
              {
                  sb.AppendFormat("<li><a href=\"/pages/{0}\">{1}</a></li>", page.PageCode, page.Name);
              }
        }
    }
    sb.Append("</ul>");
    sb.Append("</div>");
    return new MvcHtmlString(sb.ToString());
 }

谁能建议我如何使用 MVC HTML 助手（锚、列表（li）、div 等的助手）转换它

【问题讨论】：

您的 HTML 生成方法中不应包含任何数据库逻辑。相反，它应该接受要作为参数呈现的数据。

标签： html asp.net-mvc asp.net-mvc-3 html-helper

【解决方案1】：

作为应用程序的架构师，定义助手生成的内容和不生成的内容是您角色的重要组成部分，因为这取决于在您的代码中重复的位置和频率。我不会告诉你构建助手的目的是什么，因为这取决于整个应用程序的架构。但是，为了帮助您做出决定，请考虑您可以构建的两种一般类型的帮助器：全局和本地。

全局帮助程序用于在您的站点中经常重复的代码块，可能有一些小的更改可以通过传入不同的参数来处理。本地助手做同样的工作，但在给定页面上是本地的。具有在其他任何地方都找不到的重复代码段的页面应该实现本地帮助程序。那么现在...

全局助手：创建一个新的静态类来包含您的助手。然后，在容器类中创建如下所示的静态方法：

public static MvcHtmlString MyHelper(this HtmlHelper helper, (the rest of your arguments here))
{
    // Create your HTML string.
    return MvcHtmlString.Create(your string);
}

这样做是在 Html 帮助器类上创建一个扩展方法，它允许您使用标准 Html. 语法访问您的帮助器。请注意，您必须在要使用自定义助手的任何文件中包含此类的命名空间。

本地帮助器：当您希望它们位于单个视图的本地时，另一种方法可以使用帮助器。也许您的视图中有一段代码被一遍又一遍地重复。您可以使用以下语法；

@helper MyHelper()
{
    // Create a string
    @MvcHtmlString.Create(your string here);
}

然后您可以使用以下命令将其输出到您的页面上：

@MyHelper()

我们总是创建MvcHtmlString 对象的原因是因为作为 MVC 中内置的安全功能，输出的字符串被编码为在页面上的文本中显示。这意味着 < 将被编码，以便您在页面上实际看到“

为了解决这个问题，我们使用了MvcHtmlString 类，它绕过了这个安全特性，允许我们将 HTML 直接输出到页面。

【讨论】：

为什么投反对票？建设性的批评将不胜感激。

【解决方案2】：

我建议您将所有这些逻辑移到单独的 Section 中，因为它是正在呈现的 Menu。

使用Razor 的helpers 来构建它更简洁、更方便，而不是从代码构建HTML。请参阅 Scott Gu 的 this 和 this 文章，了解如何渲染部分以获得快速入门指南。

考虑使用Helper方法，比如

@Html.DropDownListFor() 或
@Html.DropDownList()

【讨论】：