ASP.NET Core - 关于标签帮助器您值得了解的五点
如果您开发过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-action 和 asp-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 - 关于标签帮助器您值得了解的五点的更多相关文章
- ASP.NET Core Razor 标签助手 - ASP.NET Core 基础教程 - 简单教程,简单编程
原文:ASP.NET Core Razor 标签助手 - ASP.NET Core 基础教程 - 简单教程,简单编程 ASP.NET Core Razor 标签助手 上一章节我们介绍了视图导入,学习了 ...
- asp.net mvc core 管道以及拦截器初了解
今天来看一下asp.net core的执行管道.先看下官方说明: 从上图可以抛光,asp.net core的执行顺序是,当收到一个请求后,request请求会先经过已注册的中间件,然后会进入到mvc的 ...
- 发布到ASP.NET CORE项目到 Windows server 2012
原文: https://github.com/zeusro/MarkdownBlog/blob/master/2018/2018-01-17-01.md 发布到ASP.NET CORE项目到 Wind ...
- 【目录】ASP.NET Core 基础教程
ASP.NET Core 基础教程 ASP.NET Core 基础教程 ASP.NET Core 简介 ASP.NET Core Windows 环境配置 ASP.NET Core macOS 环境配 ...
- ASP.NET Core 中间件自定义全局异常处理
目录 背景 ASP.NET Core过滤器(Filter) ASP.NET Core 中间件(Middleware) 自定义全局异常处理 .Net Core中使用ExceptionFilter .Ne ...
- 【Blazor】在ASP.NET Core中使用Blazor组件 - 创建一个音乐播放器
前言 Blazor正式版的发布已经有一段时间了,.NET社区的各路高手也创建了一个又一个的Blazor组件库,其中就包括了我和其他小伙伴一起参与的AntDesign组件库,于上周终于发布了第一个版本0 ...
- ASP.NET Core 中文文档 第四章 MVC(3.6.2 )自定义标签辅助类(Tag Helpers)
原文:Authoring Tag Helpers 作者:Rick Anderson 翻译:张海龙(jiechen) 校对:许登洋(Seay) 示例代码查看与下载 从 Tag Helper 讲起 本篇教 ...
- ASP.NET Core 静态文件及JS包管理器(npm, Bower)的使用
在 ASP.NET Core 中添加静态文件 虽然ASP.NET主要大都做着后端的事情,但前端的一些静态文件也是很重要的.在ASP.NET Core中要启用静态文件,需要Microsoft.AspNe ...
- 基础教程:ASP.NET Core 2.0 MVC筛选器
问题 如何在ASP.NET Core的MVC请求管道之前和之后运行代码. 解 在一个空的项目中,更新 Startup 类以添加MVC的服务和中间件. publicvoid ConfigureServi ...
随机推荐
- 4.如何实现用MTQQ通过服务器实现订阅者和发布者的通讯
1.本例子意在用moquette服务器来作为消息转发,通过订阅者订阅消息,发布者发布消息,然后发布者的消息可以通过服务器转发给订阅者 服务器例子: https://github.com/andsel/ ...
- win 结束占用端口的进程
在web开发的时候,经常开启http服务器监听某个端口,例如npm run dev等等 以下介绍通过命令行结束占用端口的程序(注:测试环境为win10) 1.启动命令行 2.在命令行输入 netsta ...
- MaintainableCSS 《可维护性 CSS》 --- ID 篇
ID 从语法上讲,当只有一个实例时,我们应该使用一个ID.当有多个时,我们应该使用一个 class. 但是,ID 作用的优先级高于 class ,在我们想覆盖一个样式的时候,这就会导致问题. 为了演示 ...
- Python3.5学习笔记-文件操作
在Python中,操作文件对象使用open函数来创建,下表列出了常用的操作file的函数: 序号 方法及描述 1.file.close() 关闭文件.关闭后文件不能再进行读写操作. 2.file.fl ...
- mysql中的limit
mysql中常使用limit做分页查询,使用方法也很简单: SELECT * FROM table LIMIT [offset,] rows #注: offset-偏移量,rows查询返回的行数 -- ...
- haproxy+tomcat集群搭建
web1和web2的部署可参考我之前的文章<Tomcat集群搭建>,这里就省去该过程了. #安装haproxy- .tar.gz cd haproxy-/ make TARGET=linu ...
- HTML5+CSS3静态页面项目-BusinessTheme的总结
因为期末考试.调整心态等等的种种原因,距离上一次的项目练习已经过了很久了,今天终于有时间继续练习HTML5+CSS3的页面架构和设计稿还原.设计图很长,整个页面分为了好几个区域,所以就不放完整的设计图 ...
- P2286 [HNOI2004]宠物收养场
题目描述 凡凡开了一间宠物收养场.收养场提供两种服务:收养被主人遗弃的宠物和让新的主人领养这些宠物. 每个领养者都希望领养到自己满意的宠物,凡凡根据领养者的要求通过他自己发明的一个特殊的公式,得出该领 ...
- OpenStack(企业私有云)万里长征第四步——DevStack整体安装规划及使用
一.前言 前期成功通过DevStack安装OpenStack,现将从机房规划到虚拟机搭建的整个过程总结如下,以供日后查阅或有需之人参考. 二.机房规划 这个整个安装过程的重点,能不能成功就看规划的如何 ...
- CSS变量variable
前面的话 一直以来,CSS中是没有变量而言的,要使用 CSS 变量,只能借助 SASS 或者 LESS 这类预编译器.新的草案发布之后,直接在 CSS 中定义和使用变量不再是幻想了.本文将详细介绍CS ...