如果您开发过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. selenium+pyquery爬取淘宝美食100页(无头静默模式)

    import re from selenium import webdriver from selenium.webdriver.common.by import By from selenium.w ...

  2. c++趣味之返回void

    void a(){} void b(){return a();} int main() { b(); ; } 这个是能编译的(vs,gcc),void函数是能返回,一般不会这么写,但是这样确实可以.你 ...

  3. Git忽略规则及.gitignore规则不生效的解决办法(转)

    在git中如果想忽略掉某个文件,不让这个文件提交到版本库中,可以使用修改根目录中 .gitignore 文件的方法(如无,则需自己手工建立此文件).这个文件每一行保存了一个匹配的规则例如: 1 2 3 ...

  4. ORACLE Index Lookup索引访问路径总结

    在ORACLE中,索引访问/查找(Index Lookup)路径有五种方式,分别为INDEX UNIQUE SCAN.INDEX RANGE SCAN.INDEX FULL SCAN.INDEX FA ...

  5. MyBatis笔记----mybatis分页

    mybatis版本3.4以下 结构 spring-mvc.xml <?xml version="1.0" encoding="UTF-8"?> &l ...

  6. MyBatis笔记----报错Exception in thread "main" org.apache.ibatis.binding.BindingException: Invalid bound statement (not found): com.ij34.model.UserMapper.selectUser

    信息: Refreshing org.springframework.context.support.ClassPathXmlApplicationContext@41cf53f9: startup ...

  7. css属性总结

    前言 有些属性不是很常用,但是工作中遇到了,记录一下,方便学习. 1.text-indent text-indent 属性规定文本块中首行文本的缩进.主要实现就像word那种首行缩进的效果. 详解ht ...

  8. 探索SQL Server元数据(二)

    背景 上一篇中,我介绍了SQL Server 允许访问数据库的元数据,为什么有元数据,如何使用元数据.这一篇中我会介绍如何进一步找到各种有价值的信息.以触发器为例,因为它们往往一起很多问题. 那么如何 ...

  9. git-------基础知识(本地推送项目版本---github上)

    创建Git仓库 一:初始化版本库:-git init 二:添加文件到缓存区:-git add  --添加所有文件 是:加个点-列:git add . 三:查看仓库状态:-git status 四:添加 ...

  10. Pyqt5+python+ErIC6+QT designer

    Eric6安装及配置 https://blog.csdn.net/weixin_41656968/article/details/80253012 Python3.6+PyQt5+Eric6.0环境配 ...