Question

我正在使用HTML帮助器来创建一个包含多个元素的控件，并使用TagBuilder进行构建。控件本身将使用包含所有子元素的TagBuilder的{{1}}呈现。

为此：https://developercommunity.visualstudio.com/content/problem/17287/tagbuilder-tostring-returns-the-type-of-tagbuilder.html

我实现了一种div方法来创建控件并将其作为Render()返回：

string

并创建了一个扩展方法以在Razor视图中调用它：

public class MyCustomControl
{
    public override string ToString()
    {
        return Render();
    }

    private string Render()
    {
        TagBuilder mainContainer = new TagBuilder("div");

        // Generate child elements and append to mainContainer...

        using (StringWriter writer = new StringWriter())
        {
            mainContainer.WriteTo(writer, HtmlEncoder.Default);

            return writer.ToString();
        }
    }
}

并将其包含在这样的视图中：

public static MyCustomControl(this IHtmlHelper html)
{
    return new MyCustomControl();
}

问题在于，不是将其呈现为html，而是将原始html文本输出到View，所以我实际上看到了：

@(Html.MyCustomControl()
)

那里没有元素。

Answer 1

您需要返回IHtmlContent而不是string的实例：

public static class HtmlHelperExtension {
    public static IHtmlContent MyCustomControl(this IHtmlHelper html)
    {
        var result = new MyCustomControl();
        return html.Raw(result.Render());
    }
}

测试用例：

public class MyCustomControl
{
    public override string ToString()
    {
        return Render();
    }

    public string Render()
    {
        TagBuilder mainContainer = new TagBuilder("div");
        mainContainer.Attributes.Add(new KeyValuePair<string, string>("data-id","123") );

        // Generate child elements and append to mainContainer...

        using (StringWriter writer = new StringWriter())
        {
            mainContainer.WriteTo(writer, HtmlEncoder.Default);

            var result=writer.ToString();
            return result;
        }
    }

结果将是：

<div data-id="123"></div>

Answer 2

我相信一种更好的方法是在自定义控件中实现IHtmlContent，如下所示：

public class MyCustomControl : IHtmlContent
{
    public void WriteTo(TextWriter writer, HtmlEncoder encoder)
    {
        TagBuilder mainContainer = new TagBuilder("div");

        // Generate child elements and append to mainContainer...

        mainContainer.WriteTo(writer, encoder);
    }
}

那么您的HtmlHelper扩展并不会改变太多：

public static IHtmlContent MyCustomControl(this IHtmlHelper html)
{
    return new MyCustomControl();
}

这应该消除在接受的答案中创建的临时字符串。

ASP.NET Core Html Helper使用TagBuilder呈现原始文本而不是格式化的HTML

2 个答案: