什么是标记帮助程序
标记帮助程序使服务器端代码可以在 Razor 文件中参与创建和呈现 HTML 元素。标记帮助程序使用 C# 创建,基于元素名称、属性名称或父标记以 HTML 元素为目标。
创建标记帮助程序
创建一个名为“TagHelpers”的文件夹来保存标记帮助程序 。
将以下 EmailTagHelper
类添加到“TagHelpers”文件夹 。
public class EmailTagHelper : TagHelper
{
private const string EmailDomain = "contoso.com";
public string MailTo { get; set; }
public override void Process(TagHelperContext context, TagHelperOutput output)
{
output.TagName = "a"; // Replaces <email> with <a> tag
var address = MailTo "@" EmailDomain;
output.Attributes.SetAttribute("href", "mailto:" address);
output.Content.SetContent(address);
}
}
使用标记帮助程序
代码语言:javascript复制在Privacy.cshtml页面添加
代码语言:javascript复制<address>
<strong>Support:</strong><email mail-to="Support"></email><br />
<strong>Marketing:</strong><email mail-to="Marketing"></email>
</address>
运行后的生成的html代码
代码语言:javascript复制<address>
<strong>Support:</strong><a href="mailto:Support@contoso.com">Support@contoso.com</a><br>
<strong>Marketing:</strong><a href="mailto:Marketing@contoso.com">Marketing@contoso.com</a>
</address>
运行后的效果
管理标记帮助程序作用域
标记帮助程序作用域由 @addTagHelper
、@removeTagHelper
和“!”选择退出字符联合控制。
使用 @addTagHelper
添加标记帮助程序
如果创建名为 net5MVC 的新 ASP.NET Core Web 应用,将向项目添加以下 Views/_ViewImports.cshtml 文件 :
代码语言:javascript复制@using net5MVC
@addTagHelper *, Microsoft.AspNetCore.Mvc.TagHelpers
@addTagHelper *, net5MVC
@addTagHelper
后第一个参数指定要加载的标记帮助程序,这里“*”指定加载所有标记帮助程序,第二个参数“Microsoft.AspNetCore.Mvc.TagHelpers”指定包含标记帮助程序的程序集。
如果想选择仅对特定视图公开标记帮助程序,可在这些视图文件中使用 @addTagHelper
指令。
使用 @removeTagHelper
删除标记帮助程序
@removeTagHelper
与 @addTagHelper
具有相同的两个参数,它会删除之前添加的标记帮助程序。 例如,应用于特定视图的 @removeTagHelper
会删除该视图中的指定标记帮助程序。 在 Views/Folder/_ViewImports.cshtml 文件中使用 @removeTagHelper
,将从 Folder 中的所有视图删除指定的标记帮助程序。
使用 _ViewImports.cshtml 文件控制标记帮助程序作用域
可将 ViewImports.cshtml 添加到任何视图文件夹,视图引擎将同时应用该文件和 Views/ViewImports.cshtml 文件中的指令。 如果为 Home 视图添加空的 Views/Home/ViewImports.cshtml 文件,则不会发生任何更改,因为 ViewImports.cshtml 文件是附加的。 添加到 Views/Home/ViewImports.cshtml 文件(不在默认 Views/ViewImports.cshtml 文件中)的任何 @addTagHelper
指令,都只会将这些标记帮助程序公开给 Home 文件夹中的视图。
使用退出字符(“!”)禁用标记帮助程序
使用标记帮助程序选择退出字符(“!”),可在元素级别禁用标记帮助程序。 例如,使用标记帮助程序选择退出字符在 <span>
中禁用 Email
验证:
<!span asp-validation-for="Email" class="text-danger"></!span>
须将标记帮助程序选择退出字符应用于开始和结束标记。 (将选择退出字符添加到开始标记时,Visual Studio 编辑器会自动为结束标记添加相应字符)。 添加选择退出字符后,元素和标记帮助程序属性不再以独特字体显示。
使用 @tagHelperPrefix
阐明标记帮助程序用途
@tagHelperPrefix
指令可指定一个标记前缀字符串,以启用标记帮助程序支持并阐明标记帮助程序用途。 例如,可以将以下标记添加到 Views/_ViewImports.cshtml 文件:
@tagHelperPrefix th:
在以下代码图像中,标记帮助程序前缀设置为 th:
,所以只有使用前缀 th:
的元素才支持标记帮助程序(可使用标记帮助程序的元素以独特字体显示)。 <label>
和 <input>
元素具有标记帮助程序前缀,可使用标记帮助程序,而 <span>
元素则相反。
适用于 @addTagHelper
的层次结构规则也适用于 @tagHelperPrefix
。