razor - Self-closing TagHelper merges html markup of sibling element -
i'm litle confused behaviour of taghelper
intoduced in asp.net core mvc. following tutorial a working email tag helper have opportunity write self-closing tags. according article purpose should use attbute htmltargetelement
. class below demostrated example:
[htmltargetelement("email", tagstructure = tagstructure.withoutendtag)] public class emailtaghelper : taghelper { private const string emaildomain = "contoso.com"; public string mailto { get; set; } public override void process(taghelpercontext context, taghelperoutput output) { output.tagname = "a"; var address = mailto + "@" + emaildomain; output.attributes.setattribute("href", "mailto:" + address); output.content.setcontent(address); } }
the markup in razor view like:
<strong>support:</strong> <email mail-to="support"/><br /> <strong>marketing:</strong> <email mail-to="marketing"/>
but have unexpected output:
<strong>support:</strong> <a href="mailto:support@contoso.com"> <span>another content</span> <strong>marketing:</strong> </a> <a href="mailto:marketing@contoso.com"></a>
why first anchor tag contains <span>
, <strong>
tags content?
without htmltargetelement
attribute , closing tags </email>
in razor view have correct behaviour.
i ran same example , able produce same problem. when debugging, noticed tagmode of output set selfclosing default. not valid anchor tag. set tag mode anchor starttagandendtag, , output generated expected.
public override void process(taghelpercontext context, taghelperoutput output) { output.tagname = "a"; // add line code output.tagmode = tagmode.starttagandendtag; var address = mailto + "@" + emaildomain; output.attributes.setattribute("href", "mailto:" + address); output.content.setcontent(address); }
this razor:
<strong>support:</strong><email mail-to="support" /><br /> <strong>marketing:</strong><email mail-to="marketing" />
produced output:
<strong>support:</strong><a href="mailto:support@contoso.com">support@contoso.com</a><br /> <strong>marketing:</strong><a href="mailto:marketing@contoso.com">marketing@contoso.com</a>
Comments
Post a Comment