What is NgStyle in Angular 10 ?
Last Updated :
30 Apr, 2021
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:
app.component.ts
import { Component, OnInit } from '@angular/core' ;
@Component({
selector: 'app-root' ,
templateUrl: './app.component.html'
})
export class AppComponent {
}
|
app.component.html
< div [ngStyle] ="{'background-color':'green'}">
GeeksforGeeks
</ div >
< div [ngStyle] ="{'color':'GREEN'}">
GeeksforGeeks
</ div >
|
Output:
Share your thoughts in the comments
Please Login to comment...