## Component Decorator 标记一个类为Angular组件并且添加到配置元数据中。 ### 如何使用 ```typescript @Component({ selector: 'greet', template: 'Hello {{ name }}' }) class Greet { name: string = 'world'; } ``` ### 描述 组件装饰器标记一个类为Anguar组件，并且提供额外的元数据在运行时决定程序如何被初始化、执行和使用。 在Angular应用程序中，组件是UI的基础构建模块。一个Angular应用就是一颗组件树。组件是指令的子集。不同于指令，在模板中的每一个组件元素总是有自己的模板和对应的组件。 一个组件想要被其它组件或者应用使用，它必需隶属于一个NgModule，并且声明在其属性`declarations`字段下面。 除了通过组件装饰器添加元数据配置外，还可以在运行时通过实现生命周期中各种钩子控制组件的行为。 #### Metadata 属性 - animations - 组件的动画列表 - changeDetection - 组件的变更检测策略 - encapsulation - 组件的样式包裹策略 - entryComponents - 动态插入到当前组件的组件列表 - exportAs - name under which the component instance is exported in a template - host - name under which the component instance is exported in a template - inputs - list of class property names to data-bind as component inputs - interpolation - 自定义插值标记 - moduleId - ES/CommonJS module id of the file in which this component is defined - outputs - list of class property names that expose output events that others can subscribe to - providers - 供应商列表，作用于当前组件及子节点 - queries - configure queries that can be injected into the component - selector - css选择器，用于在模板中标识组件 - styleUrls - 应用于组件视图的样式urls列表 - styles - 应用于组件视图的内联样式 - template - 视图的内联模板 - templateUrl - 包含视图模板的文件路径 - viewProviders - 供应商列表，作用于当前组件及子节点视图