Angular中的TypeScript装饰器是如何工作的并给出一些常见的装饰器示例

TypeScript装饰器是一种特殊类型的声明，可以附加到类声明、方法、访问器、属性或参数上，以修改类的行为或添加元数据。当装饰器被应用时，它会传递给装饰器函数，该函数可以修改类的行为或对其进行一些操作。

下面是一些常见的装饰器示例：

1. @Component：用于将类标记为Angular组件，并指定其模板、样式和其他相关选项。

@Component({
  selector: 'app-example',
  template: '<h1>Hello World</h1>',
  styles: ['h1 { color: blue; }']
})
export class ExampleComponent {}

2. @Input：用于在组件中声明一个输入属性，可以接受父组件传递的值。

@Input() name: string;

3. @Output：用于在组件中声明一个输出属性，可以向父组件发送事件。

@Output() clicked: EventEmitter<void> = new EventEmitter<void>();

4. @ViewChild：用于在组件中获取对子组件的引用。

@ViewChild(ChildComponent) childComponent: ChildComponent;

5. @Injectable：用于在Angular服务中声明注入器，并指定其提供商。

@Injectable({
  providedIn: 'root'
})
export class ExampleService {}

这些是一些常见的Angular装饰器示例，它们可以帮助我们更好地组织和管理Angular应用程序中的代码。