NgClass: if array contains item

Question

I'm trying to trigger a class if the item exist inside the array, but I can't figure it out.

  <div *ngFor="let item of someList">

     <button [ngClass]="{'isSelected': selectedArr contains item}"></button>
    ..

selectedArr is the array that contains some item.

you can refere stackoverflow.com/questions/42790602/… this link also — Aniket Avhad
– Aniket Avhad, Commented Aug 29, 2018 at 12:54

Explosion Pills · Accepted Answer · 2018-08-29 12:39:49Z

6

selectedArr.includes(item) will work. See: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/includes

Note that if item is an object, selectedArr will have to have the same object, not just an object with the same properties. Otherwise you'll have to find a different way to compare the properties of the objects to see if there's a match. Anyway, any valid JavaScript statement can be used as the value for isSelected.

<button [ngClass]="{'isSelected': selectedArr.includes(item)}"></button>

answered Aug 29, 2018 at 12:39

Explosion Pills

192k56 gold badges341 silver badges417 bronze badges

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

2 Comments

Skyan Over a year ago

Awesome, thanks. Had no clue that JavaScript statement would work :)

Jacklyn Lim Over a year ago

"Note that if item is an object, selectedArr will have to have the same object, not just an object with the same properties." Thanks for pointing this out, was having some trouble comparing until I saw this, thanks!

Harun Or Rashid · Accepted Answer · 2018-08-29 13:28:24Z

0

Use can use [class.className] also to do the same.

<button [class.isSelected]="selectedArr.indexOf(item) != -1"></button>

answered Aug 29, 2018 at 13:28

Harun Or Rashid

5,9572 gold badges21 silver badges23 bronze badges

Collectives™ on Stack Overflow

NgClass: if array contains item

2 Answers 2

2 Comments

Comments

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

2 Comments

Comments

Linked

Related