Ionic issue with animations inside of Tabs

Ionic Framework ionic-v3
1

Hi, i have a tab view like:

<ion-tabs>
  <ion-tab [root]="pendingTab" tabTitle="PENDING" tabBadge="{{ pendingOrdersCounter || ''}}" tabBadgeStyle="danger"></ion-tab>
  <ion-tab [root]="deliveryTab" tabTitle="DELIVERY" tabBadge="{{deliveryOrdersCounter || ''}}" tabBadgeStyle="danger"></ion-tab>
  <ion-tab [root]="closedTab" tabTitle="CLOSED"></ion-tab>
</ion-tabs>

and i have on pendingTab a ngFor of cards of elements, and i have an option to remove, ive applied an animation to those cards so that on (*=> void) it will apply the following animation:

trigger('itemLeave', [
      //Leave
      transition('* => out', animate('500ms ease-out', style({
        transform: 'translateX(100%)',
      }))),
    ])

Animation works just fine, but when i change tabs and then go back like:
pending -> delivery -> pending
as i have a refreshData() function that runs on ionViewWillEnter()
the animations show up for the last item.

Can someone help me with this?