ionic2 学习笔记（十一）Directive

指令概览

官网概述：

在 Angular 中有三种类型的指令：

1. 组件 — 拥有模板的指令

2. 结构型指令 — 通过添加和移除 DOM 元素改变 DOM 布局的指令

3. 属性型指令 — 改变元素、组件或其它指令的外观和行为的指令。

组件是这三种指令中最常用的。 你在快速起步例子中第一次见到组件。

结构型指令修改视图的结构。例如，NgFor 和 NgIf。 要了解更多，参见结构型指令 guide。

属性型指令改变一个元素的外观或行为。例如，内置的 NgStyle 指令可以同时修改元素的多个样式。

joshuamorony ：你可以使用一个指令时，要修改现有的DOM（文档对象模型）元素的行为，你将创建一个组件当你想要一个完全新的DOM元素。否则，组件和指令几乎相同，组件只是一个带有自己的模板的指令。

 

@Component  - 当我们要用自定义行为创建UI的可重用的DOM元素集

 

@Directive  - 当我们想要编写可重用的行为来补充现有的DOM元素

ElementRef用于访问DOM元素;

Renderer服务允许通过代码设置元素的样式。

 

 

@Input（）装饰器用于将数据传递给指令。

 

@HostListener装饰器可让您订阅DOM元素的事件。