angular装饰器 angular装饰器

angular装饰器

### 装饰器
分类:类装饰器、属性装饰器、方法装饰器、参数装饰器

官方定义:
* 它是一个表达式
* 该表达式被执行后,返回一个函数
* 函数的入参分别为 targe、name 和 descriptor
* 执行该函数后,可能返回 descriptor 对象,用于配置 target 对象
https://segmentfault.com/a/1190000008626417
### angular应用
Angular中的装饰器是一个函数,它将元数据添加到类、类成员(属性、方法)和函数参数。
##### 1.类装饰器
1.@Component
用于把某个类标记为 Angular 组件,并为它配置一些元数据,以决定该组件在运行期间该如何处理、实例化和使用
https://www.angular.cn/api/core/Component
图2019031401
![](http://markdown.ross.com.cn/data/image/2019/03/14/33841_l8wt_1476.png)
2.@NgModule 模块
https://www.angular.cn/api/core/NgModule
https://www.angular.cn/guide/ngmodule-api
图2019031402
![](http://markdown.ross.com.cn/data/image/2019/03/14/33864_egmu_5169.png)
3.@Pipe 管道
.https://www.angular.cn/api/core/Pipe
图2019031403
![](http://markdown.ross.com.cn/data/image/2019/03/14/33886_ujhl_9128.png)
4.@directive 指令
https://www.angular.cn/api/core/Directive
图2019031404
![](http://markdown.ross.com.cn/data/image/2019/03/14/33912_555z_8560.png)
5.@Injectable 注入类
https://www.angular.cn/api/core/Injectable
图2019031439
![](http://markdown.ross.com.cn/data/image/2019/03/14/34136_mwcz_2136.png)
##### 2.属性装饰器
1.@Input 输入属性
https://www.angular.cn/api/core/Input
图2019031405
![](http://markdown.ross.com.cn/data/image/2019/03/14/33944_3ss8_6744.png)
3.@ViewChild 匹配元素
https://www.angular.cn/api/core/ViewChild
图2019031406
![](http://markdown.ross.com.cn/data/image/2019/03/14/34081_sk1r_6935.png)
图2019031407
![](http://markdown.ross.com.cn/data/image/2019/03/14/34099_fwdl_5421.png)
##### 3.方法装饰器
1.@HostListener 监听
https://www.angular.cn/api/core/HostListener
图2019031408
![](http://markdown.ross.com.cn/data/image/2019/03/14/34116_j07o_5183.png)
##### 4.参数装饰器
```
import { Component, Inject } from '@angular/core';
import { MyService } from './my-service';

@Component({
  selector: 'example-component',
  template: '<div>Woo a component!</div>'
})
export class ExampleComponent {
  constructor(@Inject(MyService) myService) { // 与myService: MyService等价
    console.log(myService);
  }
}
```

评论 0

挤眼 亲亲 咆哮 开心 想想 可怜 糗大了 委屈 哈哈 小声点 右哼哼 左哼哼 疑问 坏笑 赚钱啦 悲伤 耍酷 勾引 厉害 握手 耶 嘻嘻 害羞 鼓掌 馋嘴 抓狂 抱抱 围观 威武 给力
提交评论

清空信息
关闭评论