Wt is class decorator in angular - amresh087/newronaRepos GitHub Wiki
In Angular, class decorators are a way to modify or annotate a class in a declarative fashion. They are a core feature of Angular and are used to provide metadata that Angular uses to configure and instantiate classes. Here are some of the most commonly used class decorators in Angular:
@Component: This decorator is used to define a component, which is a fundamental building block of an Angular application.
import { Component } from '@angular/core';
@Component({
selector: 'app-root',
templateUrl: './app.component.html',
styleUrls: ['./app.component.css']
})
export class AppComponent {
title = 'my-app';
}
@Directive: This decorator is used to create a directive, which allows you to attach behavior to elements in the DOM
import { Directive, ElementRef } from '@angular/core';
@Directive({
selector: '[appHighlight]'
})
export class HighlightDirective {
constructor(el: ElementRef) {
el.nativeElement.style.backgroundColor = 'yellow';
}
}
@Injectable: This decorator is used to define a service class. It tells Angular that the class can be used with the dependency injection system.
import { Injectable } from '@angular/core';
@Injectable({
providedIn: 'root',
})
export class DataService {
constructor() { }
}
@NgModule: This decorator is used to define a module, which is a way to group related components, directives, pipes, and services.
import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { AppComponent } from './app.component';
@NgModule({
declarations: [
AppComponent
],
imports: [
BrowserModule
],
providers: [],
bootstrap: [AppComponent]
})
export class AppModule { }
@Pipe: This decorator is used to create a custom pipe, which is a way to transform data in templates.
import { Pipe, PipeTransform } from '@angular/core';
@Pipe({
name: 'exponentialStrength'
})
export class ExponentialStrengthPipe implements PipeTransform {
transform(value: number, exponent: string): number {
let exp = parseFloat(exponent);
return Math.pow(value, isNaN(exp) ? 1 : exp);
}
}