【问题标题】:Use Razor Tag helpers inside custom tag helper在自定义标签助手中使用 Razor 标签助手
【发布时间】:2019-11-07 08:05:34
【问题描述】:

你好,这是我的标签助手

    [HtmlTargetElement("card")]
    public class CardTagHelper : TagHelper
    {
        public string Title { get; set; }
        public string Icon { get; set; }
        public string Url { get; set; }

        public override void Process(TagHelperContext context, TagHelperOutput output)
        {
            output.TagName = "CardTagHelper";
            output.TagMode = TagMode.StartTagAndEndTag;

            var preContent = new StringBuilder();
            preContent.AppendFormat($@"
                    <div class='card custom-card'>
                        <div class='card-header'>
                            <div class='card-title'>");

            if (Url != null)
            {
                preContent.AppendFormat($@"
                                <a asp-for='{Url}'>
                                    <div class='float-left return'>
                                        <i class='fas fa-arrow-alt-circle-left fa-lg'></i>
                                    </div>
                                </a>");
            }

preContent.AppendFormat($@"<i class='{Icon}'></i>
                                {Title}
                            </div>
                        </div>
                        <div class='card-body'>");

            var postContent = new StringBuilder();
            postContent.AppendFormat($@"                                   
                        </div>
                        <div class='card-footer'>
                        </div>
                    </div>");

            output.PreContent.SetHtmlContent(preContent.ToString());
            output.PostContent.SetHtmlContent(postContent.ToString());
        }
    }
}

输出是一个引导 4 卡

<card title="myTitle" icon="myIcon" url="redirectUrl">

    // Content here

</card>

我的问题是我想在锚的条件渲染字符串上使用 asp-page 而不是 href,但是当我添加它时,它没有任何效果或任何可点击。

编辑

这些是我的视图导入,建议我尝试在 Asp.Net Core 之前包含我的自定义帮助程序

@using MyProject
@namespace MyProject.Pages
@addTagHelper *, MyProject
@addTagHelper *, Microsoft.AspNetCore.Mvc.TagHelpers

【问题讨论】:

  • 输出标签助手应该没有任何问题。您输出的代码本身也会被处理。但是,您可能会遇到操作顺序问题。通常首先在 _ViewImports.cshtml 中引用 ASP.NET Core 内置 taghelper 库,然后再引用任何其他自定义库。这意味着在此代码存在之前,内置的帮助程序就已经运行了。首先引用您的图书馆应该可以解决这个问题。也就是说,最好完全依赖其他 taghelper:这太容易破坏东西了。
  • 我按照你说的尝试过,但它仍然不允许我点击没有 href 的 nachor,它在浏览器开发工具上准确显示 asp-page,这意味着它无法识别它跨度>
  • 嗨@Jackal,你能找到解决方案吗?

标签: c# asp.net-core asp.net-core-tag-helpers


【解决方案1】:

但是,我没有找到任何文章解释了我们如何在自定义标签助手中使用 Razor 标签助手。但是对于我的解决方案,我必须使用实际的“href”标签而不是像下面的“asp-for”剃须刀标签助手。

    public string Url { get; set; }

    public override void Process(TagHelperContext context, TagHelperOutput output)
    {
        var content = $@"<a class='nav-link text-dark' href='/{Url}'>{Title}</a>";
        output.TagName = "li";
        output.Content.SetHtmlContent(content);
        output.Attributes.Add("class", "nav-item");
    }

Razor 标签助手的行为与它为你所做的一样,@Jackal。生成的 HTML 如下 -

<li class="nav-item"><a class="nav-link text-dark" href="/Index">Home</a></li>
<li class="nav-item"><a class="nav-link text-dark" href="/Restaurants/List">Restaurants</a></li>

希望,它会有所帮助。谢谢

【讨论】:

  • 感谢您的回复,但到目前为止,最好的解决方案是仅使用 @Url.Page("","") 作为参数,以便 razor 生成 url 以避免输入整个 url
猜你喜欢
  • 1970-01-01
  • 2021-05-30
  • 2017-04-29
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2017-05-10
相关资源
最近更新 更多