## 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 - 供應商列表，作用于當前組件及子節點視圖