Angular中的装饰器

Angualr中的装饰器是一个函数,它将元数据添加到类、类成员(属性、方法)和函数参数bootstrap

用法:要想用装饰器,把它放到被装饰对象的上面或作左面ide

1.类装饰器:函数

类装饰器应用于类构造函数,能够用来监控、修改或替换类定义对象

类装饰器表达式会在运行时看成函数被调用,类的构造函数做为惟一的参数继承

@Component 标记类做为组件并收集组件配置元数据(继承Directive)索引

@Directive 标记类做为指令并收集组件配置元数据事件

声明当前类时一个指令,并提供关于该指令的元数据ip

@Pipc 声明当前类是一个管道,而且提供关于管道的元数据原型

@Injectable 标记元数据并可使用Injector注入器注入io

@NgModule是一个装饰器函数,它接收一个用来描述模块属性的元数据对象

重要的属性有:

declarations 声明本模块中拥有的视图类(Angular中有三种视图类:组件、指令和管道)

exports - declarations的子集,可用于其余模块的组件模板

imports 本模块声明的组件模板须要的类须要的类所在的其余模块 模块的导入声明

providers -服务的建立者,并加入到全局服务列表中,

bootstrap --指定应用的主视图(称为根节点),它是全部其余视图的宿主

2.属性装饰器:

属性装饰器表达式会在运行时看成函数被调用

传入2个参数

(1).对于静态成员来讲是类的构造器,对于实例成员是类的原型对象

(2).成员名字

@Input 声明一个输入属性,以便咱们能够经过属性绑定更新它

@Output 声明一个输出属性,以便咱们能够经过事件绑定进行订阅

@Hostbinding 把宿主元素的属性(好比CSS类) 绑定到指令/组件的属性

@HostListener 经过指令/组件的方法订阅宿主元素的事件

@ContentChild 配置一个内容查询

@ViewChild 配置一个视图查询

@ContentChildren 配置多个内容查询(返回QueryList类型)

@ViewChildren 配置多个视图查询(返回QueryList类型)

3.参数装饰器:

参数装饰器表达式会在运行时看成函数被调用

传入3个参数

(1).对于静态成员来讲是类的构造函数,对于实例成员是类的原型对像

(2).成员名字

(3).参数在函数列表中的索引

@Ingject指定依赖关系的参数装饰器(通常用来注入被标记Injectable的类)

@Optional将依赖项标记为可选的参数类型,若是没有找到依赖关系,注射器将提供null

@Self指定注射器只能从自己检索依赖关系

@SkipSelf指定注射器只能从父类检索依赖关系

@Host按照依赖关系来检索

你可能感兴趣的:(angular,angular.js,前端,javascript)