Html 使用角度中的数据更改重新触发CSS动画

我有两个CSS动画使用角度关键帧-当页面第一次加载时，它们运行良好。但是，当数据更改并且下一个问题加载到同一组件上时，我希望重新触发动画。有办法做到这一点吗

<!--Animations-->
<img [src]="'../../assets/_backgrounds/' + question?.backgroundId + '/l-fnt-1.png'" class="left-front-animation" >
<img [src]="'../../assets/_backgrounds/' + question?.backgroundId + '/r-fnt-1.png'" class="right-front-animation" >

---

使用角度重新触发CSS动画

constructor(private el: ElementRef) {
}

let myElement = this.el.nativeElement.querySelector(".left-front-animation"); 

myElement.classList.remove('.left-front-animation').add('.left-front-animation')

---

在TypeScript中不起作用-这次el没有样式或视线外属性组件-但仍然不会重新触发动画

constructor(private el: ElementRef) {
}

let myElement = this.el.nativeElement.querySelector(".left-front-animation"); 

myElement.classList.remove('.left-front-animation').add('.left-front-animation')