M B A R K's Blog
What is Component Decorator in Angular?

What is Component Decorator in Angular?

M B A R K's photo
M B A R K
·

1 min read

In Angular, the @Component decorator is a function that is used to mark a class as an Angular component. It provides metadata about the component, including its selector, templates, styles, and other characteristics.

The following is an example of a component in Angular that uses the @Component decorator:

import { Component } from '@angular/core';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
export class AppComponent {
  title = 'my-app';
}

In this example, the @Component decorator is applied to the AppComponent class. The @Component decorator takes an object as an argument, which specifies the metadata for the component. The selector property specifies the HTML element that represents the component in a template, and the templateUrl and styleUrls properties specify the HTML template and CSS styles for the component, respectively.

The @Component decorator is part of the @angular/core module, which is a required import for any component in an Angular application.

Angular