ngStyle in Angular

Angular NgStyle is a built-in directive that lets you set a given DOM element’s style properties. The key is a style name, and the value is an expression to be evaluated. The resulting non-null value, expressed in the given unit, is assigned to the given style property.

In app.component.html:

<input type="text" [ngStyle]="{'color':'red', 'font-weight':'800'}" [(ngModel)]="value">

<label [ngStyle]="{'color':'blue', 'font-weight':'800'}">{{value}}</label>

<input type="text" [ngStyle]="{'color':'green', 'font-weight':'800'}" value="{{value}}">

We can also use conditional statements inside of ngStyle to display colors based on the given conditions.

Thank You !!! 😉

Reference: https://www.c-sharpcorner.com/article/ngstyle-in-angular/