关于TagHelper的那些事情(3)(续)

接上

Attributes

在最新的VS2015RC版,开始支持了TagHelper的智能提示,主要体现在在写TagHelper有Attributes的提示,正确的Tag和Attribute会变成粗体,错误的Attribute不会变成粗体,这样就很容易发现书写错误。

  1. 如何定义一个TagHelper的Attribute?

    Attribute就是Property。也就是说TagHelper类中的具有getter和setter的公开Property就是它的Attribute。

    public class MyTagHelper: TagHelper
    {
        //私有property不是Attribute
        private int ID {get; set;}
    
        //这个才会是Attribute    public string Name {get; set;}
            //只读的property也不是Attribute    public string Sex {get;}
    
        public override void Process(TagHelperContext context, TagHelperOutput output)
        {
           ...
        }
    }
    

    上面我们定义了MyTagHelper,它只有一个Attribute是Name。所以View上html应该是这样:

    <my name="yy"></my>
    
  2. Attribute名和Property名关系

    • Attribute名一般都是小写,会将Property名将大写字母变小写前面加上"-",如果大写字母在第一个位置,那么只需要改成小写,前面不需要加“-”。这点和TagHelper的作用的Tag名和TagHelper类之间的关系有些类似。

      比如

      public class MyTagHelper: TagHelper
      {
         public string ParentName {get; set;}
      }
      

      其对应的View上的html是:

      <my parent-name="Mike"></my>
      
    • 当然我们也可以在Property头上添加HtmlAttributeName来添加自定义的Attribute名,这样就让这两者之间毫无关系。

      比如

      public class MyTagHelper: TagHelper
      {
           [HtmlAttributeName("male")]
           public bool Sex {get; set;}
      
           [HtmlAttributeName("NickName")]
           public string Name {get; set;}
      }
      

      这样MyTagHelper里面的Sex Property对应的Attribute在View上名字是male,而Name Property对应的Attribute是NickName:

      <my male="true" NickName="yy"></my>

      由于自定义名字,你定义成什么那么对应的Attribute就是什么,不受大小写限制,但是不能包括这些特殊字符‘@‘, ‘!‘, ‘<‘, ‘/‘, ‘?‘, ‘[‘, ‘>‘, ‘]‘, ‘=‘, ‘"‘, ‘\‘‘, ‘*‘。

  3. 不想让一个公开的Property成为Attribute

    有时候某个Property不得不公开出来,但是又不想其作为一个Attribute,怎么办?
    最简单的一个方法就是在这个Property上添加HtmlAttributeNotBound,这样就不会生成相应的Attribute了。

    public class MyTagHelper: TagHelper
    {
         [HtmlAttributeNotBound()]
         public bool Sex {get; set;}
         public string Name {get; set;}
    }
    

    还有一个不推荐的方法就是将setter设成internal或者private。

  4. Attribute类型

    通常Property的所有类型,Attribute都支持。那么怎么在Tag上设置Attribute的值?

    • 设置常量(bool, number, string, enum)

      <my name="yy" age="34" married="true" sex="Sex.Male"></my>  

      其中Sex定义如下

      public enum Sex
      {
          Male = 0,
          FeMale =1
      } 
    • 设置成一个变量

      @{
          var name = "yy";    var age = 34;
      }
      
      <my name="@name" age="age"></my>
      

      这里有一点需要注意,当Attribute的Type(也就是Property的Type)是string类型时,在设置Attribute值时需要在这个变量前加上@符号,用以和文本常量“name”作区分,其他的类型可以省去这个@符号。

    • 设置成一个表达式

      <my name="yy" location="new Location{Country="China", City="Shanghai"}"></my>
      

      其中location Attribute的Type是Location,定义如下:

      public class Location
      {
         public string Country{get; set;}
         public string City{get; set;}
      }
  5. Property类型是复杂类型

    例如上面location Attribute, 这是一个复杂类型,有公开的构造函数(默认不写构造函数,会创建一个不带参数的构造函数),我们很自然想到上面4里介绍的方法来设置这个Attribute值的几种方式:

    • 一就是创建出一个实例出来,然后赋给一个变量,再将这个变量赋给Attribute;
    • 另外一种就是直接把创建实例的表达式赋给Attribute。

    但是有时候我们会遇到这样的问题:

    • 构造函数没有public出来,用户无法创建出这样的实例;
    • 类型非常复杂,如果通过code方式创建这样的实例,代码会比较多,而且设置了哪些值会不直观,如果像WebControl那样可以有一个内嵌的Tag来设置会比较直观。

    正是基于这些问题和需要,我们需要将其类型或者Property设计成一个内嵌的TagHelper,关于如何设计成一个内嵌的TagHelper,怎么保持父子TagHelper的联系,我们下篇再介绍。

待续...

时间: 2024-11-01 10:42:15

关于TagHelper的那些事情(3)(续)的相关文章

关于TagHelper的那些事情(3)

写在开头 前面介绍了TagHelper的基本概念和内嵌的TagHelpers,想必大家对TagHelper都有一定的了解.TagHelper看上去有点像WebControl,但它不同于WebControl,没有复杂的生命周期.状态保持.服务器事件以及较高权限,它只能修改自己Tag的内容.有时觉得它更像angular写出来的一个widget,有自己特有的Tag,并对其进行解析生成出widget ui和启动脚本,但是它具有更高的权限,能访问服务器端信息. 在这章,将要介绍如何自定义TagHelper

关于TagHelper的那些事情——自定义TagHelper(格式化输出、依赖注入使用)

自定义TagHelper的最后一步就是在Process方法或ProcessAsync方法中添加展现代码.熟悉WebControl开发的朋友都知道Render方法,在这个方法中会添加展现的Html元素和启动脚本,TagHelper的这一步我们要做的也就是和Render方法一样. 这里我们主要利用上面方法中的第二个参数output来往View上输出展现部分. 首先让我们看以output类型TagHelperOutput的定义: /// <summary> /// Class used to rep

关于TagHelper的那些事情(2)

写在开始 在上一篇文章中,简单介绍了什么是TagHelper,怎么使用它.接下来我会简单介绍一下微软随着ASP.NET5一起发布的内嵌的TagHelpers.它们分别是: AnchorTagHelper CacheTagHelper EnvironmentTagHelper InputTagHelper LabelTagHelper SelectTagHelper OptionTagHelper TextAreaTagHelper ValidationMessageTagHelper Valid

关于TagHelper的那些事情

概要 TagHelper是ASP.NET 5的一个新特性.也许在你还没有听说过它的时候, 它已经在技术人员之间引起了大量讨论,甚至有一部分称它为服务器控件的回归.实际上它只不过是一个简化版本,把HTML和服务器内容混合在一起,没有控件生命周期,状态保持和事件.它不像服务器控件那样,对页面所有内容都具有访问权限.它只能访问到自己所生成的内容. 什么是TagHelper? 我们曾经在MVC项目中使用在HtmlHelps.比如当需要在View上添加一个导航栏的时候,我们就会添加下面代码到页面上去: <

使用 Ninject

在[ASP.NET MVC 小牛之路]系列上一篇文章(依赖注入(DI)和Ninject)的末尾提到了在ASP.NET MVC中使用Ninject要做的两件事情,续这篇文章之后,本文将用一个实际的示例来演示Ninject在ASP.NET MVC中的应用. 为了更好的理解和撑握本文内容,强烈建议初学者阅读本文前先阅读依赖注入(DI)和Ninject. 本文目录: 准备工作 新建一个名为BookShop的空白解决方案.在该解决方案中分别添加一个名为BookShop.WebUI的MVC空应用程序,和一个

ASP.NET MVC

[ASP.NET MVC 大牛之路]03 - C#高级知识点概要(2) - 线程和并发 摘要: 我也想过跳过C#高级知识点概要直接讲MVC,但经过前思后想,还是觉得有必要讲的.我希望通过自己的经验给大家一些指引,带着大家一起走上ASP.NET MVC大牛之路,少走弯路.同时也希望能和大家一起交流,这样也能发现我自己的不足,对我自己的帮助也是非常大的.建议大家对C#撑握的不错的时候,可以去看一些...阅读全文 posted @ 2014-12-29 23:15 Liam Wang 阅读(9730)

[ASP.NET MVC 小牛之路]05 - 使用 Ninject实现依赖注入

在[ASP.NET MVC 小牛之路]系列上一篇文章(依赖注入(DI)和Ninject)的末尾提到了在ASP.NET MVC中使用Ninject要做的两件事情,续这篇文章之后,本文将用一个实际的示例来演示Ninject在ASP.NET MVC中的应用. 为了更好的理解和撑握本文内容,强烈建议初学者阅读本文前先阅读依赖注入(DI)和Ninject. 本文目录: 准备工作 新建一个名为BookShop的空白解决方案.在该解决方案中分别添加一个名为BookShop.WebUI的MVC空应用程序,和一个

C#中的委托和事件(续)

C#中的委托和事件(续) 引言 如果你看过了 C#中的委托和事件 一文,我想你对委托和事件已经有了一个基本的认识.但那些远不是委托和事件的全部内容,还有很多的地方没有涉及.本文将讨论委托和事件一些更为细节的问题,包括一些大家常问到的问题,以及事件访问器.异常处理.超时处理和异步方法调用等内容. 为什么要使用事件而不是委托变量? 在 C#中的委托和事件 中,我提出了两个为什么在类型中使用事件向外部提供方法注册,而不是直接使用委托变量的原因.主要是从封装性和易用性上去考虑,但是还漏掉了一点,事件应该

iOS最新上线流程+续费 2015-7-20更新

一.程序上线前准备 确认图标是否?全,应?的icon图标 在以前图?片直接命名 为icon就可以了,在xcode5以后,苹果加 ?入了images.xcasset这个?文件夹,所有的 图标全都在这?里配置,有2个需要配置, 1.appicon(应?用的图标),2. LaunchImage(启动默认图) 应?用名称的修改 打开?工程,在info?里?面的Bundle displayName中修改应?用的名称 你的应?用在上线前需要进?行测试,保证基本功能不会崩溃,并且能够看到的按钮, 点击都是要求