dimanche 28 avril 2019

Angular ngClass/ngIf not rerendering on changes

I'm working on an Angular project where I need to have one class or another depending on a variable (and they have to change live, without refreshing).

I tried using *ngIf/else and [ngClass]and they do work but they do not re-render. They only work when I refresh the website

Using *ngIf/else:

<i
 *ngIf="favSongs.includes(track.id); else plus"
 (click)="setToFav(track.id)"
 class="fa fa-check"
></i>
<ng-template #plus>
  <i (click)="setToFav(track.id)" class="fa fa-plus"></i>
</ng-template>

Using [ngClass]:

<i
  (click)="setToFav(track.id)"
  [ngClass]="{'fa fa-check': favSongs.includes(track.id), 
  'fa fa-plus': !favSongs.includes(track.id)}"
></i>

As said before, it does work but only when you refresh. I'm looking for something like React, when you update the class the component get re-rendered.




Aucun commentaire:

Enregistrer un commentaire