ngClass Directive in Angular | Directives | Angular 15+

The ngClass is an attribute directive. The ngClass directive is used to add a CSS class dynamically to a webpage element.

products.component.css

.back_red{
	background:red;
}

products.component.html

<div [ngClass]="{back_red:redvariable=='red'}">show this if variableis only red</div>

products.component.ts

export class ProductsComponent {
    redvariable:any="red"
}