Угловая анимация с асинхронным списком - PullRequest
0 голосов
/ 20 октября 2018

Попытка добавить анимацию, когда элемент списка удален или добавлен.

Элементы извлекаются из firebase и добавляются в DOM с помощью асинхронного канала.

Проблема в том, что анимация применяется ко всем элементам, а не только к тому, который удален / добавлен,Есть ли способ сделать то, что я пытаюсь сделать?

animations: [
trigger('addToListAnimation', [
  state('in', style({
    opacity: 1,
    transform: 'translateX(0)',
    color: 'red'
  })),
  transition('void => *', [
    style({
      opacity: 0,
      transform: 'translateX(-100px)'
    }),
    animate(300)
  ]),
  transition('* => void', [
    style({
      opacity: 0,
      transform: 'translateX(100px)'
    }),
    animate(300)
  ])
])
]

Html:

 <tr *ngFor="let shift of activeShifts|async"" [@addToListAnimation]>
...