Item does not animate

@yasirpanjsheri wrote:

I am trying to animate items list when removed… I have embedded state in the response of the list… I also found that * => void does not work… so I rearranged the code as following

.ts

  animations: [
     trigger('listItemState', [
        state('in', style({opacity: 1, height:'*', minHeight: '*'})),
        state('out', style({opacity: 0, height: '1px', minHeight: '1px;'})),
        transition('in => out', animate('0.25s 10 ease-out'))
     ])
   ]

and this is part of the html [@listItemState]="job.state" *ngFor="let job of jobsList; let i = index;"
the job.state is embedded as I said and holds value in

In the function remove at .ts:

  remove(i) {
      job.state = job.state === 'in' ? 'out' : 'in';
      this.jobsList.splice(i , 1);
  }

I have done similar with an accordion list and its working… but I can’t figure out why this does not work!

Posts: 1

Participants: 1

Read full topic