zoukankan      html  css  js  c++  java
  • ASP.NET Core 5.0 MVC 页面标记帮助程序的使用

    什么是标记帮助程序

    标记帮助程序使服务器端代码可以在 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);
            }
          
        }

    使用标记帮助程序

    在Privacy.cshtml页面添加
    <address>
        <strong>Support:</strong><email mail-to="Support"></email><br />
        <strong>Marketing:</strong><email mail-to="Marketing"></email>
    </address>

    运行后的生成的html代码

    <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 文件 :

    @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

    !

    • 作       者 : 明志德道
    • 希     望: 如果内容对您有用,动动小手点个赞吧,您的支持就是我持续写作的动力!
    • 声     明1 : 如有错误,欢迎讨论,请勿谩骂^_^。
    • 声     明2 : 原创博客请在转载时保留原文链接或在文章开头加上本人博客地址,否则保留追究法律责任的权利。
  • 相关阅读:
    2、容器初探
    3、二叉树:先序,中序,后序循环遍历详解
    Hebbian Learning Rule
    论文笔记 Weakly-Supervised Spatial Context Networks
    在Caffe添加Python layer详细步骤
    论文笔记 Learning to Compare Image Patches via Convolutional Neural Networks
    Deconvolution 反卷积理解
    论文笔记 Feature Pyramid Networks for Object Detection
    Caffe2 初识
    论文笔记 Densely Connected Convolutional Networks
  • 原文地址:https://www.cnblogs.com/for-easy-fast/p/14354703.html
Copyright © 2011-2022 走看看