如果您开发过ASP.NET Core Web应用程序,您应该已经熟悉了Tag Helper。ASP.NET Core应用程序依赖Tag Helper来呈现表单和表单字段是很常见的。所以,一个视图通常包含许多Tag Helper以及标准的HTML标记。您可以通过多种方式使用Tag Helper来提高开发的效率。本文将讨论其中的某些问题。

1. 使用Tag Helper智能感知

就像HTML元素和JavaScript代码一样,Visual Studio也可以为Tag Helper显示智能感知。如果您使用Visual Studio 2017,您可能需要做一些工作才能获得手智能感知。从工具菜单中选择扩展和更新菜单选项。在结果对话框中查找Razor Language Services

点击下载按钮下载扩展程序,然后关闭Visual Studio,关闭IDE时,将安装Razor Language Services。所以,请耐心等待一会儿。安装完成后,您将看到如下所示的成功对话框:

现在,您可以在Razor视图文件( *.cshtml )中获取智能感知。例如,下图显示的是表单Tag Helper的智能感知。

2. 自定义Tag Helper字体和颜色

如果您的视图中混合使用了许多Tag Helper和HTML标记,您可能希望突出显示Tag Helper为不同字体和颜色。幸运的是,Visual Studio允许您这样做。转到工具 - > 选项,然后转到环境节点下的字体和颜色。

您可以使用“HTML Razor Tag Helper元素”和“HTML Razor Tag Helper属性”设置来自定义Tag Helper的外观。下图显示的是自定义 form 标签的样式。

您可以看到Tag Helper的标签以及_asp- * _属性显示不同的颜色和字体大小。

3. 禁用Tag Helper

有时您可能需要禁用元素的Tag Helper。例如,您可能希望使用<form>作为标准HTML标记,而不是作为Tag Helper。您可以禁用元素的Tag Helper,如下所示:

如您看到的 ! 字符已添加到<form>的开始和结束标签。属性Tag Helper(如 asp-actionasp-controller)将不适用于此<form>元素。

4. 添加Tag Helper前缀

如果您希望区分Tag Helper与普通的HTML标记(不仅仅是视觉区别),那么您可以使用标签前缀。如果您使用ASP.NET Web服务器控件和Web用户控件,那么您应该熟悉标签前缀的想法。要指定标签前缀,请使用 _  @tagHelperPrefix _ 指令,如下所示:

    @tagHelperPrefix taghelper:

上面的行对所有的Tag Helper分配了一个前缀taghelper:。您可以在 _ViewImports.cshtml _或单个视图文件中写入此行。一旦添加,您需要这样写Tag Helper标记:

您可以看到不能再使用<form>标签,而是使用<taghelper:form>标签。

5. 在视图中添加或删除Tag Helper

如果在Views文件夹中打开 _ViewImports.cshtml 文件,您将找到这一行代码:

    @addTagHelper *, Microsoft.AspNetCore.Mvc.TagHelpers

  @addTagHelper 用于使一个或多个Tag Helper可用于项目中的所有视图文件。第一个参数*表示所有来自该程序集Microsoft.AspNetCore.Mvc.TagHelpers中的Tag Helper都将可以使用。您还可以指定特定的Tag Helper而不是*。请参阅以下示例:

    @addTagHelper Microsoft.AspNetCore.Mvc.TagHelpers.FormTagHelper, Microsoft.AspNetCore.Mvc.TagHelpers

上面的代码只添加了FormTagHelper到视图。这样,只有<form>将被视为Tag Helper,智能感知也只会作用于它。

假设您已使用_ViewImports.cshtml文件将所有内置的Tag Helper添加到项目中。您希望将它们提供给大多数视图,除了某几个视图。如何禁用这些视图的Tag Helper?使用   @removeTagHelper指令。以下代码显示了如何实现:

    @removeTagHelper Microsoft.AspNetCore.Mvc.TagHelpers.FormTagHelper, Microsoft.AspNetCore.Mvc.TagHelpers

上述代码从特定视图中删除FormTagHelper(您需要将该代码放置在该视图的顶部)。

有关ASP.NET Core Tag Helper的详细介绍请阅读官方文档:https://docs.microsoft.com/en-us/aspnet/core/mvc/views/tag-helpers/intro

原文:《Five Things Worth Knowing About ASP.NET Core Tag Helpers》http://www.binaryintellect.net/articles/2678a2f2-3236-45a6-a0e5-e6340d9930d5.aspx

翻译:Sweet Tang

本文地址:http://www.cnblogs.com/tdfblog/p/five-things-worth-knowing-about-asp-net-core-tag-helpers.html

欢迎转载,请在明显位置给出出处及链接。

ASP.NET Core - 关于Tag Helper值得了解的五点的更多相关文章

  1. ASP.NET Core MVC – Tag Helper 组件

    ASP.NET Core Tag Helpers系列目录,这是第五篇,共五篇: ASP.NET Core MVC – Tag Helpers 介绍 ASP.NET Core MVC – Caching ...

  2. ASP.NET Core MVC – Tag Helpers 介绍

    ASP.NET Core Tag Helpers系列目录,这是第一篇,共五篇: ASP.NET Core MVC – Tag Helpers 介绍 ASP.NET Core MVC – Caching ...

  3. [asp.net core]定义Tag Helpers

    原文地址 https://docs.microsoft.com/en-us/aspnet/core/mvc/views/tag-helpers/authoring Getting started wi ...

  4. ASP.NET Core MVC Tag Helpers 介绍

    简介 Tag Helpers 提供了在视图中更改和增强现有HTML元素的功能.将它们添加到视图中,会经过Razor模板引擎处理并创建一个HTML,之后再返回给浏览器.有一些Tag Helpers,其实 ...

  5. ASP.NET Core MVC – Caching Tag Helpers

    简介 缓存可以大大提高应用程序加载时间和响应速度.我们可以使用缓存Tag Helpers缓存不会频繁更改的HTML内容. 在上一篇文章中,我们谈到了Tag Helpers,演示Tag Helpers能 ...

  6. ASP.NET Core MVC – Form Tag Helpers

    ASP.NET Core Tag Helpers系列目录 ASP.NET Core MVC Tag Helpers 介绍 ASP.NET Core MVC – Caching Tag Helpers ...

  7. ASP.NET Core MVC – 自定义 Tag Helpers

    ASP.NET Core Tag Helpers系列目录,共四篇: ASP.NET Core MVC Tag Helpers 介绍 ASP.NET Core MVC – Caching Tag Hel ...

  8. asp.net core 系列之Response caching(1)

    这篇文章简单的讲解了response caching: 讲解了cache-control,及对其中的头和值的作用,及设置来控制response caching; 简单的罗列了其他的缓存技术:In-me ...

  9. Tag Helpers in forms in ASP.NET Core

    Tag Helpers in ASP.NET Core Tag Helpers in forms in ASP.NET Core HTML Form element ASP.NET Core buil ...

随机推荐

  1. win10电脑怎么录制视频 电脑录制视频软件

    win10电脑怎么录制视频?相信不少网友正在面临这个疑惑.现如今是网络信息科技时代,快速传播信息的途径和方式有很多种.其中,通过录制电脑视频,可以制作视频教程.游戏解说,还可以录制在线视频存储影视资源 ...

  2. Android为TV端助力 转载:android MVC设计模式

    Controller控制器 import android.app.Dialog; import android.app.ProgressDialog; import android.os.Bundle ...

  3. Jump Flood Algorithms for Centroidal Voronoi Tessellation

    Brief Implemented both CPU and GPU version, you could consider this as the basic playground to imple ...

  4. PyCharm 专业版激活方法

    郑重声明: JetBrains公司的PyCharm专业版是收费的,本文所述激活方法仅限于短时内体验和试用PyCharm专业版,使用后请当天立即删除.若需要继续使用PyCharm专业版,请在官网购买.当 ...

  5. PyCharm 使用Github管理Django项目

    不管是对于教程代码免费分享的需要,还是项目开发过程中的版本管理,Github都是我们首选的开源代码仓库,如果你没有私有仓库,并且不用保护代码,那么将项目上传到Github上是最佳的选择. 关于如何使用 ...

  6. vi中的全局替换

    一.基本语法 替换命令语法: :[addr]s/源字符串/目标字符串/[option] 全局替换: :%s/源字符串/目标字符串/g 参数说明: [addr]--表示检索范围,省略时表示当前行. &q ...

  7. python3接收、解析邮件

    邮件接收 python3可以使用poplib.POP3进行邮件接收,具体如下: import poplib from email.parser import Parser def get_email( ...

  8. SQL Server Alert发送告警邮件少了的原因

    最近突然发现我们部署在数据库上面的告警(Alert),当错误日志里面出现错误时,并不是每个错误日志都会发送邮件出来.如下所示,设置了告警"SQL Server Severity Event ...

  9. myBase7.0破解

    永久性破解 Mybase7Pro破解版下载:链接:https://pan.baidu.com/s/1ezb8bSqI0OPZnVgx-snA_Q  提取码:n72t 1.下载后安装 myBase-De ...

  10. windows 解放鼠标快捷键

    win+ 调整某个窗口的放大缩小靠边站,最小化 窗口间的切换alt+tablealt (按住)+table(一下)+ 上下左右 alt(一下)+table(一下)相邻切换 alt(按住)+tables ...