什么是@符号在typescript中的意思--Angular 2

Question

我正在使用typescript进行角度2应用程序开发.

但是当我们为组件或路由配置或其他地方编写代码时,我们使用"@"符号.

我的问题是这个符号的含义以及为什么需要它？

Answer 1

@你所指的符号被称为decorator.

装饰器提供了一种为类声明和成员添加注释和元编程语法的方法.

基本上当你这样做时,@component你告诉编译器该类是一个angular2组件,其元数据作为参数传递.

例如.

@Component({
  moduleId: module.id,
  selector: 'heroes-app',
  templateUrl: 'heroes.component.html',
  styleUrls: ['heroes.component.css'],  
})
class HeroesComponent{}

此代码将告诉编译器类HeroesComponent应该是一个angular2组件,元数据作为参数传递,它将创建一个组件类.

装饰者不是魔术.这只是功能调用.

例如.

@Component({
selector: 'static-component',
template: `<p>Static Component</p>`
})
class StaticComponent {}

相当于:

class DynamicComponent {
}

const dynamicComponent = Component({
    selector: 'dynamic-component',
    template: `<p>Dynamic Component</p>`
})(DynamicComponent);

希望这可以帮助.

Answer 2

这意味着您正在应用装饰器.

随着TypeScript和ES6中Classes的引入,现在存在某些场景需要额外的功能来支持注释或修改类和类成员.装饰器提供了一种为类声明和成员添加注释和元编程语法的方法.装饰器是JavaScript的第1阶段提案,可作为TypeScript的实验性功能使用.

• 如何实现打字稿装饰器？
• https://www.typescriptlang.org/docs/handbook/decorators.html