razor - Nesting TagHelpers in ASP.NET Core MVC 6 -

the asp.net core taghelper documentation gives following example:

public class websitecontext {     public version version { get; set; }     public int copyrightyear { get; set; }     public bool approved { get; set; }     public int tagstoshow { get; set; } }  [targetelement("website-information")] public class websiteinformationtaghelper : taghelper {     public websitecontext info { get; set; }      public override void process(taghelpercontext context, taghelperoutput output)     {         output.tagname = "section";         output.content.setcontent(             $@"<ul><li><strong>version:</strong> {info.version}</li>             <li><strong>copyright year:</strong> {info.copyrightyear}</li>             <li><strong>approved:</strong> {info.approved}</li>             <li><strong>number of tags show:</strong> {info.tagstoshow}</li></ul>");         output.tagmode = tagmode.starttagandendtag;     } } 

this can used in razor .cshtml follows:

<website-information info="new websitecontext {     version = new version(1, 3),     copyrightyear = 1790,     approved = true,     tagstoshow = 131 }"/> 

this generate following html:

<section>     <ul>         <li><strong>version:</strong> 1.3</li>         <li><strong>copyright year:</strong> 1790</li>         <li><strong>approved:</strong> true</li>         <li><strong>number of tags show:</strong> 131 </li>     </ul> </section> 

this pretty ugly tag helper syntax. there way nest tag helper , full intelli-sense allowed child of website-information can context? see example below:

<website-information>     <context version="1.3" copyright="1790" approved tags-to-show="131"/> </website-information> 

in use case, website-information element has many attributes , want add 1 or more separate nested elements.

update

i have raised this suggestion on asp.net github page implement feature taghelpers.

you can nest tag helpers, although maybe other options view components, partial views or display templates might better suited scenario described op.

this simple child tag helper:

[htmltargetelement("child-tag", parenttag="parent-tag")] public class childtaghelper : taghelper {     public string message { get; set; }      public override void process(taghelpercontext context, taghelperoutput output)     {         // create parent div         output.tagname = "span";         output.content.setcontent(message);         output.tagmode = tagmode.starttagandendtag;          } } 

and simple parent tag helper:

[htmltargetelement("parent-tag")] [restrictchildren("child-tag")] public class parenttaghelper: taghelper {     public string title { get; set; }      public override async task processasync(taghelpercontext context, taghelperoutput output)     {                     output.tagname = "div";          // add specific parent helper html         var header = new tagbuilder("h1");         header.attributes.add("class", "parent-title");         header.innerhtml.append(this.title);         output.precontent.setcontent(header);          // set inner contents of helper(will process nested tag helpers or other piece of razor code)         output.content.setcontent(await output.getchildcontentasync());                 } } 

in razor view write following:

<parent-tag title="my title">     <child-tag message="this nested tag helper" /> </parent-tag> 

which rendered as:

<div>     <h1 class="parent-title">my title</h1>     <span>this nested tag helper</span> </div> 

you can optionally enforce tag helpers nested in particular way:

• use [restrictchildren("child-tag", "another-tag")] in parent tag helper limit allowed nested tag helpers
• use parenttag parameter when declaring child tag helper enforce tag being nested inside particular parent tag [htmltargetelement("child-tag", parenttag = "parent-tag")]