打字稿中@符号的含义是什么-Angular 2 [英] What is meaning by @ symbol in typescript --Angular 2

问题描述

我正在使用打字稿进行angular 2应用程序开发.

I am using typescript for angular 2 application development.

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

But when we write code for component or route config or some other place we use "@" symbol.

我的问题是这个符号的含义以及为什么要使用它?

My question is what this symbol means and why it is required?

推荐答案

您所指的@符号称为decorator.

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

Decorators provide a way to add both annotations and a meta-programming syntax for class declarations and members.

基本上，当您执行@component时，您会告诉编译器该类是angular2组件，元数据作为参数传递.

Basically when you are doing @component you are telling compiler that the class is a angular2 component with the metadata passed as an argument.

例如.

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

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

this code will tell compiler that class HeroesComponent is supposed to be an angular2 component with metadata passed as arguments and it will create a component class.

装饰器不是魔术.只是函数调用.

例如.

@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);

希望这会有所帮助.

这篇关于打字稿中@符号的含义是什么-Angular 2的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！