自定义一个 TagHelper ViewContext 引用的空间 using Microsoft.AspNetCore.Mvc.Rendering;
[HtmlTargetElement("card")]
public class CardTagHelper: TagHelper
{
public string Title { get; set; }
public string Icon { get; set; }
public string Url { get; set; }
public string Tag { get; set; }
[ViewContext]
public ViewContext viewContext { get; set; }
IWorkOrderService workOrderService;
public CardTagHelper(IWorkOrderService workOrderService)
{
this.workOrderService = workOrderService;
}
public override void Process(TagHelperContext context, TagHelperOutput output)
{
output.TagName = Tag??"div";
output.TagMode = TagMode.StartTagAndEndTag;
var preContent = new StringBuilder();
preContent.Append("<a>test</a>");
viewContext.ViewBag.zhangsan = Title;
int count = 0;
var list = workOrderService.PageFind(0, null, null, null, null, null, 0, 1, 10, out count);
viewContext.ViewBag.list = list;
viewContext.ViewBag.count = count;
output.PreContent.SetHtmlContent(preContent.ToString());
output.PreContent.SetContent(Icon);
}
}
Microsoft.AspNetCore.Mvc 中也有一个 ViewContext ,注意不要引用错
前端的写法
引入名称和所在程序集
@addTagHelper CooperAdmin.CardTagHelper,CooperAdmin
这里嵌套调用
<card title="myTitle" icon="myIcon" url="redirectUrl">
@ViewBag.zhangsan
<ul>
@foreach (var li in ViewBag.list)
{
<li>@li.Id, @li.Name</li>
}
</ul>
<card title="myTitle2" icon="myIcon2" url="redirectUrl2">
</card>
</card>
生成的代码:
<div>myIcon
myTitle
<ul>
<li>6643, 苍茫的天涯是我的爱</li>
<li>6642, 苍茫的天涯是我的爱</li>
<li>6641, 苍茫的天涯是我的爱</li>
<li>6640, 苍茫的天涯是我的爱</li>
<li>6639, 苍茫的天涯是我的爱</li>
<li>6638, 苍茫的天涯是我的爱</li>
<li>6637, 苍茫的天涯是我的爱</li>
<li>6636, 动可爱的人</li>
</ul>
<div>myIcon2</div>
</div>
值得注意的是使用标签时标签的名称和标签的属性名和程序代码中的属性不是完全一致的。在遇到标记名称和属性是由多个单词组成时应该注意
MailTo
属性,请使用 <email mail-to="value"/>
等效项。[HtmlTargetElement]
属性的目标元素,标记帮助程序采用 Pascal 大小写格式的 C# 类名和属性转换为短横线格式。 因此,要在 Razor 中使用 WebsiteInformationTagHelper
,请编写 <website-information />
。
本文链接:https://blog.nnwk.net/article/39
有问题请留言。版权所有,转载请在显眼位置处保留文章出处,并留下原文连接
Leave your question and I'll get back to you as soon as I see it. All rights reserved. Please keep the source and links
友情链接:
子卿全栈
全部评论