Can I use a Tag Helper in a custom Tag Helper that returns html?

Question

I recently ran into a situation where I would like to use a tag helper within a tag helper. I looked around and couldn't find anyone else trying to do this, am I using a poor convention or am I missing documentation?

Ex. Tag Helper A outputs HTML that contains another tag helper.

Ex.

[HtmlTargetElement("tag-name")]
public class RazorTagHelper : TagHelper
{
    public override void Process(TagHelperContext context, TagHelperOutput output)
    {
        StringBuilder sb = new StringBuilder();
        sb.Append("<a asp-action=\"Home\" ");
        output.Content.SetHtmlContent(sb.ToString());
    }
}

Is there a way for me to process the <a asp-action> </a> tag helper from C#? Or to reprocess the output HTML with tag helpers?

Trottier

Could this be of any help? #32693357 – Purusha

@Purusha Thanks for the link, but no that's not what I'm looking to do, I would like to have a single input tag, without other nested tags. What I'd really like to do is call one tag helper from another. – Trottier

By any chance you are looking for View Components? – Distrust

View Components could work for this scenario, however, I'd really like to keep the HTML-esque syntax of tag helpers if possible – Trottier

As of ASP.NET 2.1, some of the classes have been changed about. See this Q&A: #54582950 – Sedum

Answer 1

No you cannot. TagHelpers are a Razor parse time feature.

One alternative is creating a TagHelper and manually invoking its ProcessAsync/Process method. Aka:

var anchorTagHelper = new AnchorTagHelper
{
    Action = "Home",
};
var anchorOutput = new TagHelperOutput("a", new TagHelperAttributeList(), (useCachedResult, encoder) => new HtmlString());
var anchorContext = new TagHelperContext(
    new TagHelperAttributeList(new[] { new TagHelperAttribute("asp-action", new HtmlString("Home")) }),
    new Dictionary<object, object>(),
    Guid.NewGuid());
await anchorTagHelper.ProcessAsync(anchorContext, anchorOutput);
output.Content.SetHtmlContent(anchorOutput);

Rubinstein

What a mess, it's unfortunate if that is the only way to do this. I'm going to leave this question open for a day or so just to confirm that this is the way I'd have to do it. If there is not another answer, I'll certainly accept this. Thank you – Trottier

I think this answer is great. For everything advanced, viewcomponents are the way to go. For your case, simple use the UrlHelper directly might be better @JacobLinney – Distrust

@ChristianGollhardt Thank you for opinion and suggestion; I just want to confirm that there isn't a better way to do this. And this wasn't my actual usage case, merely an abstraction. – Trottier

Answer 2

If anyone's looking to reuse the built-in tag helpers from asp.net core, you can use the IHtmlGenerator instead. For reusing other types of tag helpers, I haven't found a simpler option then @N. Taylor Mullen answer

Here is how to reuse the asp-action tag helper:

[HtmlTargetElement("helplink")]
public class RazorTagHelper : TagHelper
{
    private readonly IHtmlGenerator _htmlGenerator;

    public RazorTagHelper(IHtmlGenerator htmlGenerator)
    {
        _htmlGenerator = htmlGenerator;
    }

    [ViewContext]
    public ViewContext ViewContext { set; get; }

    public override void Process(TagHelperContext context, TagHelperOutput output)
    {
        output.TagName = "div";
        output.TagMode = TagMode.StartTagAndEndTag;
        var actionAnchor = _htmlGenerator.GenerateActionLink(
            ViewContext,
            linkText: "Home",
            actionName: "Index",
            controllerName: null,
            fragment: null,
            hostname: null,
            htmlAttributes: null,
            protocol: null,
            routeValues: null
            );
        var builder = new HtmlContentBuilder();
        builder.AppendHtml("Here's the link: ");
        builder.AppendHtml(actionAnchor);
        output.Content.SetHtmlContent(builder);
    }
}

Hola

Answer 3

I don't know if this works for your scenario, but it is possible to inherit from the AnchorTagHelper and then do your customisations like this.

public class TestTagHelper : AnchorTagHelper
{
    public TestTagHelper(IHtmlGenerator htmlGenerator) : base(htmlGenerator) { }

    public async override Task ProcessAsync(TagHelperContext context, TagHelperOutput output)
    {
        // Replaces <test> with <a> tag
        output.TagName = "a"; 
        // do custom processing
        output.Attributes.SetAttribute("class", "custom-class");
        // let the base class generate the href 
        // note the base method may override your changes so it may be  
        // preferable to call it first instead of last.
        await base.ProcessAsync(context, output);
    }
}

Then you can just use this tag helper in your view with all the built-in goodness of the default AnchorTagHelper.

<test asp-action="Index" asp-route-id="5"></test>

Trail

Fair warning, base.ProcessAsync should be called First, as the base tag helper can easily overwrite any changes you make to the output before it's called. e.g with SetHtmlContent(). Once you have called the base code, you can add your additions around what is already in place. – Rosas