ASP.Net Core:从一个标签助手输出2个标签

时间:2018-10-29 22:44:45

标签: asp.net-core asp.net-core-mvc asp.net-core-2.0 tag-helpers asp.net-core-tag-helpers

使用ASP.Net Core的标签助手,有什么方法可以在根级别将1个标签转换为2个标签?我知道您可以使用TagHelperOutput.TagName == null完全删除一个标签,但是我想知道如何才能执行相反的操作以输出多个标签。

例如,来自:

<canonical href="/testing" />

收件人:

<link rel="canonical" href="http://www.examples.com/widgets" />
<link rel="next" href="http://www.examples.com/widgets?page=2" />

下面是一个示例标签帮助程序,它输出一个标签,但不能同时输出两个标签:

[HtmlTargetElement("canonical")]
public class CanonicalLinkTagHelper : TagHelper
{
    public string Href { get; set; }
    public override void Process(TagHelperContext context, TagHelperOutput output)
    {
        output.TagName = "link";
        output.Attributes.SetAttribute("rel", "canonical");
        output.Attributes.SetAttribute(new TagHelperAttribute("href", new HtmlString(Href)));
    }
}

2 个答案:

答案 0 :(得分:4)

根据this documentation,使用TagHelperOutput.TagName == null删除标签后,您必须能够使用output.PostContent.AppendHtml()添加自定义HTML

更新

PostContent仅在之后追加。要替换全部内容,您将需要使用output.Content.SetHtmlContent(

答案 1 :(得分:0)

TagHelpers可以输出所需数量的html,只需使用output.Content编写输出即可。这是一个基本示例:

[HtmlTargetElement("canonical")]
public class CanonicalTagHelper : TagHelper
{
    public string Link1Rel { get; set; }
    public string Link2Rel { get; set; }
    public string Link1Href { get; set; }
    public string Link2Href { get; set; }

    public override void Process(TagHelperContext context, TagHelperOutput output)
    {
        output.TagName = null;

        outputLink(Link1Rel, Link1Href, output);
        outputLink(Link2Rel, Link2Href, output);            
    }

    private void outputLink(string rel, string href, TagHelperOutput output)
    {
        TagBuilder link = new TagBuilder("link");
        link.Attributes.Add("rel", rel);
        link.Attributes.Add("href", href);
        link.TagRenderMode = TagRenderMode.SelfClosing;

        output.Content.AppendHtml(link);
    }
}

用法:

<canonical link1-href="https://link1.com" link1-rel="canocical" link2-href="https://link2.com" link2-rel="next"></canonical>

输出:

<link href="https://link1.com" rel="canocical">
<link href="https://link2.com" rel="next">