Class change conditionally Ionic2

Question

I want to change my class for an element, but I don’t know how to handle it using Ionic 2. I tried this way, but this is wrong:

<span [ngClass]="{(user.id == this.session.userDefaultId) : 'class1 class2', (user.id != this.session.userDefaultId) : 'class3 class4'}"> ... </span> 

Can someone explain to me how to do this, please? :)

Answer 1

You must specify the class name first, followed by a condition

 <span [ngClass]="{'class1 class2' : (user.id == this.session.userDefaultId), 'class3 class4':(user.id != this.session.userDefaultId)}"> ... </span> 

Answer 2

You can use a simple ternary operator to set the class for your example.

 <span [ngClass]="(user.id == this.session.userDefaultId) ? 'class1 class2' : 'class3 class4'"> ... </span> 

Answer 3

try it

 <span [class.class1]="user.id == this.session.userDefaultId" [class.class2]="user.id == this.session.userDefaultId" [class.class3]="user.id != this.session.userDefaultId" [class.class4]="user.id != this.session.userDefaultId">