ngStyle in Angular

#angular #programming #webdev

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/

Top comments (0)

An Animated Guide to Node.js Event Loop

Node.js doesn’t stop from running other operations because of Libuv, a C++ library responsible for the event loop and asynchronously handling tasks such as network requests, DNS resolution, file system operations, data encryption, etc.

What happens under the hood when Node.js works on tasks such as database queries? We will explore it by following this piece of code step by step.