Angular Анимация Карусель ⇐ CSS

[Anonymous]

Я преобразовал следующую карусель из React в Angular, но не смог добиться для нее эффекта анимации. Можете ли вы дать мне решение? Невозможно добиться внешнего вида с помощью угловой анимации.
Ссылка на карусель — https://codepen.io/andyNroses/pen/KaENLb
@component({
selector:'image-slider',
templateUrl:'image-slider.html',
animation:[{
trigger('slideInOut',[
transition(':enter',[
style({transform:'translateX(-100%)', opacity:1}),
animate:('600ms ease-in', style({transform:'translateX(0%)', opacity:0}))
]),
transition(':leave',[
style({transform:'translateX(0%)', opacity:1}),
animate:('600ms ease-out', style({transform:'translateX(100%)', opacity:1}))
])
])
}]

})

prev
next

Подробнее здесь: https://stackoverflow.com/questions/656 ... n-carousel