In this article, we are going to see what is NgStyle in Angular 10 and how to use it.
NgStyle is used to add some style to an HTML element
Syntax:
<element [ngStyle] = "typescript_property">
Approach:
- Create the Angular app to be used
- In app.component.html make an element and sets its class using ngStyle directive
- Serve the angular app using ng serve to see the output
Example 1:
import { Component, OnInit } from '@angular/core';
@Component({
selector: 'app-root',
templateUrl: './app.component.html'
})
export class AppComponent {
}
<div [ngStyle] ="{'background-color':'green'}">
GeeksforGeeks
</div>
<div [ngStyle] ="{'color':'GREEN'}">
GeeksforGeeks
</div>
Output:
