上一篇博客我讲解了TagHelper的基本用法和自定义标签的生成，那么我就趁热打铁，和大家分享一下TagHelper的高级用法~~，大家也可以在我的博客下随意留言。

对于初步接触asp.net core的骚年可以看看我对TagHelper的了解和看法：

《asp.net core新特性(1):TagHelper》

之后，我也会继续撰写博文，继续分享asp.net core的一些新特性，比如DI，ViewComponent以及bower等asp.net mvc中没有的新东西。

ok，咱们就开始吧~~

在之前我对TagHelper的分享当中提及了，TagHelper能够去替代原来在@Html帮助类中的一些功能，比如form，a等标签，而且写在html代码中更加的舒服，符合html的语法。

<!--标签助手版form-->
<form asp-controller="Home" asp-action="Index" class="form-horizontal" method="post">

</form>
<!--Html帮助类版form-->
@using (Html.BeginForm("Index", "Home", FormMethod.Post,, new { Class = "form-horizontal" }))
{

}

那么，在Html帮助类中最有用的Model与Tag的转换，自动表单的生成，微软是否也给出了解决方案呢？答案是肯定的。Microsoft还专门分出了单独的说明页面来讲述TagHelper的自动表单生成，英文功底好的同学可以直接查看MS的官方文档《Introduction to using tag helpers in forms in ASP.NET Core》。

文档中提及了对于表单控件，我们可以直接在asp-for属性中直接填写Model中的属性名，即可自动生成对应的控件类型和填入默认值。

ok,我们来尝试一下。

（1）创建ViewModel类

public class SignUpViewModel
 {
 [Required]
 [Display(Name ="用户名")]
 [MaxLength(30,ErrorMessage = "用户名不能超过30")]
 public string UserName { get; set; }

 [Required]
 [DataType(DataType.Password)]
 [RegularExpression(@"((?=.*\d)(?=.*\D)|(?=.*[a-zA-Z])(?=.*[^a-zA-Z]))^$",ErrorMessage ="密码至少包含两种以上字符")]
 [Display(Name ="密码")]
 public string Password { get; set; }

 [DataType(DataType.MultilineText)]
 public string Description { get; set; }
 }

对于写过asp.net mvc的开发者肯定不会陌生这种验证方式~~

（2）编写TagHelper标签

为了与Html区分，我写了两者的比较版本

<form asp-controller="Home" asp-action="SignUp" method="post" class="form-horizontal">
 <div class="form-group">
 <label asp-for="UserName"></label>
 <input asp-for="UserName" />
 <span asp-validation-for="UserName"></span>
 </div>
 <div class="form-group">
 @Html.LabelFor(m=>m.Password)
 @Html.PasswordFor(m=>m.Password)
 @Html.ValidationMessageFor(m=>m.Password)
 </div>
 <div class="form-group">
 <label asp-for="Description"></label>
 <textarea asp-for="Description"></textarea>
 <span asp-validation-for="Description"></span>
 </div>
 <div class="form-group">
 <input type="submit" value="提交" />
 <input type="reset" value="重置" />
 </div>
</form>

（3）验证表单

public IActionResult SignUp(SignUpViewModel model)
 {
  if (ModelState.IsValid)
  {
  return RedirectToAction("Index");
  }
  else
  {
  return RedirectToAction("Index",model);
  }
 }

（4）结果

　　ok,如果觉得这样就结束了，那么就不算TagHelper高级应用，那只能充其量在翻译MS的文档罢了。

　　那么，重点来了，既然MS能让我们创建自定义TagHelper，那我为什么不能在TagHelper当中使用Model的值呢？于是我开始在asp.net core开源github项目中寻找，终于是找到了ImputTagHelper的源码。

　　在源码中，由三个对象一起来完成标签的生成

protected IHtmlGenerator Generator { get; }

 [HtmlAttributeNotBound]
 [ViewContext]
 public ViewContext ViewContext { get; set; }

 /// <summary>
 /// An expression to be evaluated against the current model.
 /// </summary>
 [HtmlAttributeName(ForAttributeName)]
public ModelExpression For { get; set; }

三个对象均是通过依赖注入的方式来实现对象的生成。

　　（1）其中Generator为发生器，负责生成各种类型的标签

　　（2）ViewContext为视图上下文，获取视图上下文相关信息

　　（3）For获取到当前Model的相关信息，包括Required等关键信息

　　有了这三个标签，我们也可以在自定义的标签助手中获取你想要的Model信息，比如我可以向form中填入Model信息，让标签助手自动生成form表单中的所有内容；也可以向ul标签中填入树信息，让其自动生成树列表等等

　　如下就是我编写的自动生成表单

//自定义标签助手名为bg-form
 [HtmlTargetElement("bg-form")]
 public class FormTagHelper : TagHelper
 {
  [ViewContext]
  [HtmlAttributeNotBound]
  public ViewContext ViewContext { get; set; }

  [HtmlAttributeName("asp-for")]
  public ModelExpression For { get; set; }

  protected IHtmlGenerator Generator { get; }

  public FormTagHelper(IHtmlGenerator generator)
  {
   Generator = generator;
  }

  [HtmlAttributeName("asp-controller")]
  public string Controller { get; set; }

  [HtmlAttributeName("asp-action")]
  public string Action { get; set; }

  //异步方法
  public override async Task ProcessAsync(TagHelperContext context, TagHelperOutput output)
  {
   output.TagName = "form";
   if (!string.IsNullOrWhiteSpace(Controller))
   {
    output.Attributes.Add("action", "/" + Controller + "/" + Action);
   }

   output.Attributes.Add("class", "form-horizontal");

   //获取子属性
   var props = For.ModelExplorer.Properties;
   foreach (var prop in props)
   {
    //生成表单
    var div = new TagBuilder("div");
    div.AddCssClass("form-group");
    var label = Generator.GenerateLabel(ViewContext, prop, null, prop.Metadata.DisplayName, null);
    var input = Generator.GenerateTextBox(ViewContext, prop, prop.Metadata.PropertyName, null, null, null);
    var span = Generator.GenerateValidationMessage(ViewContext, prop, prop.Metadata.PropertyName, null, ViewContext.ValidationMessageElement, null);
    div.InnerHtml.AppendHtml(label);
    div.InnerHtml.AppendHtml(input);
    div.InnerHtml.AppendHtml(span);
    output.Content.AppendHtml(div);
   }
   //添加按钮
   var btn = new TagBuilder("div");
   btn.AddCssClass("form-group");
   var submit = new TagBuilder("input");
   submit.Attributes.Add("type", "submit");
   submit.Attributes.Add("value", "提交");
   var reset = new TagBuilder("input");
   reset.Attributes.Add("type", "reset");
   reset.Attributes.Add("value", "重置");
   btn.InnerHtml.AppendHtml(submit);
   btn.InnerHtml.AppendHtml(reset);
   output.Content.AppendHtml(btn);
   //将原有的内容添加到标签内部
   output.Content.AppendHtml(await output.GetChildContentAsync());

  }
 }

只要在html加入

<bg-form asp-controller="Home" asp-action="SignUp" asp-for="@Model">
</bg-form>

即可自动生成表单

Over，今天关于TagHelper就分享到这

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持。

# asp.net  # core  # TagHelper  # Form  # asp.net core新特性之TagHelper标签助手  # asp.net core razor自定义taghelper的方法  # Razor TagHelper实现Markdown转HTML的方法  # Visual Studio 2017下ASP.NET CORE的TagHelper智能提示解决办法  # NET Core TagHelper实现分页标签  # 解读ASP.NET 5 & MVC6系列教程（13）：TagHelper  # ASP.NET Core MVC中的标签助手(TagHelper)用法  # 表单  # 自动生成  # 自定义  # 填入  # 出了  # 我对  # 相关信息  # 文档  # 类中  # 新特性  # 我就  # 来了  # 趁热打铁  # 两种  # 能在  # 我们可以  # 微软  # 那我  # 英文  # 能让 

相关栏目： 【 网站优化151355 】 【 网络推广146373 】 【 网络技术251813 】 【 AI营销90571 】

相关推荐： Gemini手机端怎么发图片_Gemini手机端发图方法【步骤】  浅谈javascript alert和confirm的美化  Laravel模型关联查询教程_Laravel Eloquent一对多关联写法  香港服务器网站卡顿？如何解决网络延迟与负载问题？  绝密ChatGPT指令：手把手教你生成HR无法拒绝的求职信  iOS中将个别页面强制横屏其他页面竖屏  Laravel如何使用Facades（门面）及其工作原理_Laravel门面模式与底层机制  Laravel如何使用Guzzle调用外部接口_Laravel发起HTTP请求与JSON数据解析【详解】  Laravel如何生成API文档？（Swagger/OpenAPI教程）  INTERNET浏览器怎样恢复关闭标签页_INTERNET浏览器标签恢复快捷键与方法【指南】  Laravel如何自定义分页视图？（Pagination示例）  阿里云网站搭建费用解析：服务器价格与建站成本优化指南  Laravel怎么自定义错误页面_Laravel修改404和500页面模板  浏览器如何快速切换搜索引擎_在地址栏使用不同搜索引擎【搜索】  如何用手机制作网站和网页,手机移动端的网站能制作成中英双语的吗？  JavaScript 输出显示内容(document.write、alert、innerHTML、console.log)  如何选择可靠的免备案建站服务器？  高防服务器租用指南：配置选择与快速部署攻略  Google浏览器为什么这么卡 Google浏览器提速优化设置步骤【方法】  大连 网站制作,大连天途有线官网？  Laravel怎么上传文件_Laravel图片上传及存储配置  免费网站制作appp,免费制作app哪个平台好？  如何快速打造个性化非模板自助建站？  Laravel如何配置任务调度？（Cron Job示例）  详解阿里云nginx服务器多站点的配置  活动邀请函制作网站有哪些,活动邀请函文案？  Laravel怎么配置.env环境变量_Laravel生产环境敏感数据保护与读取【方法】  如何在建站之星绑定自定义域名？  网站制作价目表怎么做,珍爱网婚介费用多少？  微信推文制作网站有哪些,怎么做微信推文，急？  在线制作视频的网站有哪些,电脑如何制作视频短片？  网站制作壁纸教程视频,电脑壁纸网站？  Win11怎么查看显卡温度 Win11任务管理器查看GPU温度【技巧】  Laravel如何使用Socialite实现第三方登录？（微信/GitHub示例）  Laravel软删除怎么实现_Laravel Eloquent SoftDeletes功能使用教程  北京专业网站制作设计师招聘,北京白云观官方网站？  教你用AI润色文章，让你的文字表达更专业  重庆市网站制作公司,重庆招聘网站哪个好？  浅谈Javascript中的Label语句  java ZXing生成二维码及条码实例分享  如何在宝塔面板中修改默认建站目录？  小米17系列还有一款新机？主打6.9英寸大直屏和旗舰级影像  *服务器网站为何频现安全漏洞？  JS弹性运动实现方法分析  Windows10如何删除恢复分区_Win10 Diskpart命令强制删除分区  Laravel如何使用Livewire构建动态组件？（入门代码）  如何快速选择适合个人网站的云服务器配置？  Laravel如何保护应用免受CSRF攻击？（原理和示例）  微信小程序 scroll-view组件实现列表页实例代码  企业在线网站设计制作流程,想建设一个属于自己的企业网站，该如何去做？