CODEWITHSUNDEEP
angulartypescriptng-class
SNT
SNT

Reputation: 313

ngClass combining multple conditions?

How do I combine multiple conditions in Angular? im using angular 12 at the moment.

example:

[ngClass]="condition1 ? 'className1': 'classname2'" this works if condition 1 is true or false.

now how to add multiple?

[ngClass]='condition1 ? 'className1' : 'classname2' && conditionX ? 'classNameY' : 'classNameZ'"

only the first condition seems to be checked, anything else after the && doesn't show up

Upvotes: 0

Views: 595

Answers (3)

Noor Ul Ain
Noor Ul Ain

Reputation: 600

For multiple conditions you can do like this:

[ngClass]="[ condition1 ? 'className1' : 'className2', conditionX ? 'classNameY' : 'classNameZ']"

separate each condition with ','

Upvotes: 2

sid
sid

Reputation: 2027

Using an object you can handle multiple conditions

<div [ngClass]="{'firstClass': true, 'secondClass': true, 'thirdClass': false}">
     // your code...
</div>

Upvotes: 1

Aayush Bhankale
Aayush Bhankale

Reputation: 61

For multiple conditions classes to apply refer Angular Docs. It has good explanation. Link

Upvotes: 1

Related Questions