我怎样才能创建Asp.Net MVC模板化控件？ [英] How can I create a templated control with Asp.Net MVC?

问题描述

我试图创建Asp.Net MVC模板化控件。通过模板控制，我的意思是接受标记像这样输入的控制：

 ＆LT;％Html.PanelWithHeader（）
    .HeaderTitle（我的头）
    .Content（（）=＆GT;
    {％GT;
        ＆LT;！ - 用于没有特别的理由UL  - ＆GT;
        ＆LT; UL＆GT;
          ＆LT;李＆gt;将样品与LT; /李＆GT;
          ＆LT;李＆gt;将第二项＆lt; /李＆GT;
        ＆LT; / UL＆GT;
    ＆LT;％}）渲染（）; ％GT;
 

请注意：是的，这是非常相似的 Telerik的是如何创建它的MVC控，我喜欢的语法。

下面是我的PanelWithHeader code：

  //扩展的HtmlHelper
公共静态PanelWithHeaderControl PanelWithHeader（此的HtmlHelper助手）
{
    返回新PanelWithHeaderControl（）;
}公共类PanelWithHeaderControl
{
    私人字符串headerTitle;    私人诉讼getContentTemplateHandler;    公共PanelWithHeaderControl HeaderTitle（字符串headerTitle）
    {
        this.headerTitle = headerTitle;        返回此;
    }    公共PanelWithHeaderControl内容（动作getContentTemplateHandler）
    {
        this.getContentTemplateHandler = getContentTemplateHandler;        返回此;
    }    公共无效渲染（）
    {
        //显示headerTitle为＆lt; DIV CLASS =头＆GT; headerTitle＆LT; / DIV＆GT;        getContentTemplateHandler（）;
    }
}
 

这显示了 UL ，但我不知道怎么我的Render方法中显示自定义的code。

我一直在使用没有成功的尝试的HtmlHelper。我也试着重写ToString方法，以便能够使用＆LT;％= Html.PanelWithHeader（）... 语法，但我一直有语法错误

我怎样才能做到这一点？

解决方案

原来，在 Telerik的MVC扩展是开源的，可在codePLEX 所以我花了快看看源$ C ​​$ C。

他们创造从的HtmlHelper实例ViewContext向HtmlTextWriter。当他们写它，它写入到该页面。

在code变为：

  //扩展的HtmlHelper
公共静态PanelWithHeaderControl PanelWithHeader（此的HtmlHelper助手）
{
    HtmlTextWriter的作家= helper.ViewContext.HttpContext.Request.Browser.CreateHtmlTextWriter(helper.ViewContext.HttpContext.Response.Output);    返回新PanelWithHeaderControl（作家）;
}公共类PanelWithHeaderControl
{
    私人HtmlTextWriter的作家;    私人字符串headerTitle;    私人诉讼getContentTemplateHandler;    公共PanelWithHeaderControl（HtmlTextWriter的作家）
    {
        this.writer =作家;
    }    公共PanelWithHeaderControl HeaderTitle（字符串headerTitle）
    {
        this.headerTitle = headerTitle;        返回此;
    }    公共PanelWithHeaderControl内容（动作getContentTemplateHandler）
    {
        this.getContentTemplateHandler = getContentTemplateHandler;        返回此;
    }    公共无效渲染（）
    {
        writer.Write（＆LT; D​​IV CLASS = \\面板与头\\＆GT;＆LT; D​​IV CLASS = \\头\\＆gt;中+ headerTitle +＆LT; / DIV＆GT;＆LT; D​​IV CLASS = \\内容模板\\＆gt;中）;        getContentTemplateHandler（）;        writer.Write（＆LT; / DIV＆GT;＆LT; / DIV＆gt;中）;
    }
}
 

*我知道，code是一个烂摊子

I'm trying to create a templated control with Asp.Net MVC. By templated control, I mean a control that accepts markup as input like so:

<% Html.PanelWithHeader()
    .HeaderTitle("My Header")
    .Content(() =>
    { %>
        <!-- ul used for no particular reason -->
        <ul>
          <li>A sample</li>
          <li>A second item</li>
        </ul>
    <% }).Render(); %>

Note: Yes, this is very similar to how Telerik creates its MVC controls, I like the syntax.

Here's my PanelWithHeader code:

// Extend the HtmlHelper
public static PanelWithHeaderControl PanelWithHeader(this HtmlHelper helper)
{
    return new PanelWithHeaderControl();
}

public class PanelWithHeaderControl
{
    private string headerTitle;

    private Action getContentTemplateHandler;

    public PanelWithHeaderControl HeaderTitle(string headerTitle)
    {
        this.headerTitle = headerTitle;

        return this;
    }

    public PanelWithHeaderControl Content(Action getContentTemplateHandler)
    {
        this.getContentTemplateHandler = getContentTemplateHandler;

        return this;
    }

    public void Render()
    {
        // display headerTitle as <div class="header">headerTitle</div>

        getContentTemplateHandler();
    }
}

This displays the ul, but I have no idea how to display custom code within my Render method.

I have tried using the HtmlHelper with no success. I have also tried overriding the ToString method to be able to use the <%=Html.PanelWithHeader()... syntax, but I kept having syntax errors.

How can I do this?

解决方案

It turns out that the Telerik MVC extensions are open-source and available at CodePlex so I took a quick look at the source code.

They create an HtmlTextWriter from the ViewContext of the HtmlHelper instance. When they write to it, it writes to the page.

The code becomes:

// Extend the HtmlHelper
public static PanelWithHeaderControl PanelWithHeader(this HtmlHelper helper)
{
    HtmlTextWriter writer = helper.ViewContext.HttpContext.Request.Browser.CreateHtmlTextWriter(helper.ViewContext.HttpContext.Response.Output);

    return new PanelWithHeaderControl(writer);
}

public class PanelWithHeaderControl
{
    private HtmlTextWriter writer;

    private string headerTitle;

    private Action getContentTemplateHandler;

    public PanelWithHeaderControl(HtmlTextWriter writer)
    {
        this.writer = writer;
    }

    public PanelWithHeaderControl HeaderTitle(string headerTitle)
    {
        this.headerTitle = headerTitle;

        return this;
    }

    public PanelWithHeaderControl Content(Action getContentTemplateHandler)
    {
        this.getContentTemplateHandler = getContentTemplateHandler;

        return this;
    }

    public void Render()
    {
        writer.Write("<div class=\"panel-with-header\"><div class=\"header\">" + headerTitle + "</div><div class=\"content-template\">");

        getContentTemplateHandler();

        writer.Write("</div></div>");
    }
}

*I know, the code is a mess

这篇关于我怎样才能创建Asp.Net MVC模板化控件？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！