本文详细解析了Angular框架中@Component装饰器的使用方法及其重要性。@Component允许开发者定义组件的元数据，包括模板、样式、输入输出属性等，使组件能够在应用中正确实例化和运行。文章还介绍了如何将组件添加到NgModule的declarations中，以便在其他组件和应用中调用。
重点描述Angular中的@componen----通俗的解释：创建一个组件，附上一些行为。
@Component修饰符可以让开发者通过Angular 的@Component创建一个类似Java的class，并同时提供额外的元数据用于定义在运行环境中，这个component将如何运行/实例化以及被使用。
@Component始终存在一个视图模板，在这个视图模板中，每一个元素只能有一个component被实例化。
任何一个Component都是ng-module的一部分，这样它就可以被其他应用和其他Component所调用。为了定义Component是ng-module的一个成员之一，开发者应该在ng-module的declarations属性中，将自己开发的Component列出。
列举元数据属性
animations------------------规定了当前的动画表
selector----------------------样式选择器，它可以在一个复杂的视图模板中识别出当前的component.
templateUrl-----------------视图模板的url
styleUrls---------------------运用当前component中的一组样式表的url列表
changeDetection----------通过这个component变更侦测策略
encapsulation--------------通过该component设计封装策略
exportAs---------------------名下component的实例化被导出在一个模板视图中。
host---------------------------class属性映射到host元素上，并绑定了事件和属性
inputs-------------------------当前class属性名列表，当前components输入的数据绑定。
interpolation------------------自定义改写工具，被用于当前的component视图模板中
moduleld ---------------------文件中ES/CommonJS 模块的id,而当前component就定义在该模块中。
outputs ---------------------- 当前class属性名列表，对外暴露输出事件，这样其他components就可以调用。
providers ---------------------providers列表，该列表可以用于当前component和其子component.
queries -----------------------将配置问题注入到当前component中。
template ---------------------视图模板
viewProvider-providers--列表，该列表可以用于当前component，以及其子视图。
扫一扫
7574
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
