Add and remove classes Angular without controller

Question

I have just started a new project with angular and I learnt abount *ngIf. I would like to use *ngIf in order to add / remove a class from a div

Before click

<div class="done">Foo</div>

After click

<div class="notdone">Foo</div>

use ngClass instead of ngIf read from here https://angular.io/api/common/NgClass — Aravind
– Aravind, Commented Oct 30, 2019 at 21:29

João Ghignatti · Accepted Answer · 2019-10-30 21:42:10Z

1

You have different ways of approaching this.

<div [ngClass]="{'done': conditionToDone, 'notdone': !conditionToDone}">Foo</div>

Where done or notdone are added via a condition.

answered Oct 30, 2019 at 21:31

João Ghignatti

2,4112 gold badges15 silver badges26 bronze badges

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

3 Comments

Thanks a lot! It solved my problem. I have to say that you left ' " ' after '{' and before '}' and got an error, but solved quickly!

Edited my answer. Happy to help.

Another suggestion: [ngClass]="condition ? 'done' : 'notdone'".