How to change style property in angular with if statement [duplicate]

Question

Below question is in angular 7

<header class="stick-top forsticky gradient">

Here is my html content in angular

current_path = localStorage.getItem("current_path");

current path is a variable in my component.

I wants to make if current_path != '/' in component then heder will be like this.

<header class="stick-top forsticky gradient">

else

<header class="stick-top forsticky">

I wants to remove gradient class from hrader tag if my current_path is '/'

Lia · Accepted Answer · 2019-02-03 08:41:46Z

4

you can use ngClass:

<header class="stick-top forsticky" [ngClass]="{'gradient':current_path != '/'}">

answered Feb 3, 2019 at 8:41

Lia

12k3 gold badges35 silver badges53 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Dhananjai Pai · Accepted Answer · 2019-02-03 08:46:50Z

2

If it is a single class, a good enough alternative to ngClass is

<header class="stick-top forsticky" [class.gradient]=" current_path != '/' " >

You may prefer this syntax since it is easier to format and prettify in the html templates than js objects that resolve to classes.

answered Feb 3, 2019 at 8:46

Dhananjai Pai

6,0052 gold badges12 silver badges25 bronze badges