将字符串构建器转换为标签构建器 asp.net mvc 4

Question

我正在构建一个 HTML Helper 并且它完成了工作，但我正在使用 StringBuilder class 来输出以下内容

<div class="panel panel-default">
    <div class="panel-heading">The Panel Title</div>
    <div class="panel-body">
        <h2><span>Content stuff</span></h2>
    </div>
</div>

如何使用 TagBuilder class 编写 MVC 4 HTML Helper？

Answer 1

TagBuilder span = new TagBuilder("span");
span.InnerHtml = "Content stuff";

TagBuilder heading = new TagBuilder ("h2");
heading.InnerHtml = span.ToString();

StringBuilder html = new StringBuilder();

TagBuilder div = new TagBuilder("div");
div.AddCssClass("panel-heading");
div.InnerHtml = "The Panel Title";
html.Append(div.ToString());

div = new TagBuilder("div");
div.AddCssClass("panel-body");
div.InnerHtml = heading.ToString();
html.Append(div.ToString());

div = new TagBuilder("div");
div.AddCssClass("panel panel-default");
div.InnerHtml = html.ToString();

return MvcHtmlString.Create(div.ToString());

Answer 2

希望对大家有所帮助。我为 TagBuilder 写了一个 extension 用于实现复杂的 html 结构：

    var htmlFactory = new HtmlFactory(); 
    htmlFactory.Add("div")
        .Style("display", "block")
        .Class("base-item")
        .Inner(elements =>
        {
            elements.Add("span")
                .Class("header")
                .Text("Header");
            elements.Add("div")
                .Class("subheader")
                .Inner(inner =>
                {
                    inner.Add("span")
                        .Class("subheader-content")
                        .Text("SubHeader");
                });
        });

    var result = htmlFactory.ToString();

并产生以下结果：

<div class="base-item" style="display:block;">
    <span class="header">Header</span>
    <div class="subheader">
        <span class="subheader-content">SubHeader</span>
    </div>
</div>

将字符串构建器转换为标签构建器 asp.net mvc 4

converting string builder to tagbuilder asp.net mvc 4

asp.net-mvc

tagbuilder