C#如何从字符串呈现标签助手

Question

考虑以下自定义 TagHelper 的 Process 函数：

public override async void Process(TagHelperContext context, TagHelperOutput output) {
    // ...

    var htmlContent = (await output.GetChildContentAsync()).GetContent();
    output.Content.SetHtmlContent(htmlContent);
}

我可以使用以下内容，它会渲染嵌套的 taghelper：

<custom-button>
    <icon name="search" />
</custom-button>

但是我需要更多类似的东西：

<custom-button icon="search"></custom-button>

这意味着我需要以某种方式在自定义按钮 taghelper 中呈现图标 taghelper。以下是我尝试过但失败的方法：

public override async void Process(TagHelperContext context, TagHelperOutput output) {
    // ...

    // Set the content (first with the icon tag)
    output.Content.SetHtmlContent("<icon name=\"search\" />");

    // Render the icon
    var htmlContent = (await output.GetChildContentAsync()).GetContent();

    // Set the final content
    output.Content.SetHtmlContent(htmlContent);
}

有什么办法可以做到吗？

编辑！这是完整的 CustomButtonTagHelper 代码：

[HtmlTargetElement("custom-button")]
public class CustomButtonTagHelper : TagHelper
{
    private readonly IFileVersionProvider _fileVersionProvider;

    [ViewContext]
    public ViewContext ViewContext { get; set; }
    
    public CustomButtonTagHelper(IFileVersionProvider fileVersionProvider)
    {
        _fileVersionProvider = fileVersionProvider;
    }

    [HtmlAttributeName("icon")]
    public string Icon { get; set; }

    public override async void Process(TagHelperContext context, TagHelperOutput output) {

        // ...

        output.TagMode = TagMode.StartTagAndEndTag;
        output.TagName = "button";

        // Set the content (first with the icon tag)
        output.Content.SetHtmlContent($"<icon name=\"{this.Icon}\" />");

        // Render the icon
        var htmlContent = (await output.GetChildContentAsync()).GetContent();

        // Set the final content
        output.Content.SetHtmlContent(htmlContent);
    }
}

Answer 1

如果你想给Custom TagHelper添加属性，你可以尝试设置output.Attributes。 这是一个演示：

public override async void Process(TagHelperContext context, TagHelperOutput output)
            {


                output.TagMode = TagMode.StartTagAndEndTag;
                output.TagName = "button";
                output.Attributes.Add("icon", Icon);
               
            }

查看：

<custom-button icon="search"></custom-button>

渲染的 HTML：

<button icon="search"></button>