为什么Angular 2要使用装饰器?

Question

我刚开始使用Angular 2，想知道为什么像selector和template这样的属性被放在组件装饰器中，而不是放在组件类中。

在Angular 2中使用所有这些装饰器有什么意义?

Answer 1

• 为了方便工具在模板中提供各种支持，如:

  • 错误检查
  • 自动完成
  • 图形化GUI设计器

• 从装饰器生成代码，允许:

  • 以声明的方式定义一些东西或者
  • 根据一些配置生成不同的代码(如即将到来的脱机模板编译器)

要使用表达式可能产生的结果，需要执行

代码。装饰器可以很容易地静态计算，而不需要执行TypeScript代码(除了一个简单和有限的子集)。

Answer 2

除了已经给出的特定于平台的答案之外，我还想从更一般的角度进行讨论。在我看来，这个问题在某种程度上与选择装饰器模式而不是继承的决定有关(例如，@Component vs extends Component)

使用装饰器的一些好处是:

1。关注点分离:

装饰器中的信息是声明性的，它们定义了类的行为，很可能不会随着时间的推移而改变，并且由框架使用。类属性和字段是特定于类的数据，将始终被处理并经常更新，并且只在类本身中有意义。这两种数据不应该混在一起。

2。支持多次修改

由于Diamond问题，许多语言阻止多重继承。另一方面，一个类可以有多个用于不同目的的装饰器(例如@Component和已弃用的@RouteConfig)

Answer 3

通常，装饰器允许您执行函数。例如，@Component执行从Angular2导入的Component函数。在底层，这样的装饰器在类上定义了一些元数据。这允许您配置类，将其"标记"为组件。然后，Angular2就可以把模板中的选择器链接到这样的类。

这篇文章可以给你更多关于幕后发生的事情的提示:

• https://medium.com/@ttemplier angular2 -修饰符和类继承- 905921 dbd1b7 # .ryvc6ewsc

你可以注意到，在TypeScript中，装饰器可以应用在不同的层次(类、类属性、方法参数)。

Answer 4

在angular中，我们为组件、服务、指令等所有东西创建类，

那么，angular编译器是如何编译你的代码并将其转换成可以在浏览器中运行的脚本的呢?这是因为装饰者。简单来说，你可以说，装饰器允许你将元数据附加到typescript类中，这样angular就可以知道这个类是组件、指令还是模块等等。

Answer 5

Decorator将一个类标记为Angular组件，并提供配置来决定该组件在运行时应该如何处理、实例化和使用。它提供了各种选项来配置它，如selector, templateUrl, template, styleUrls, styles, providers等。