Запуск Angular обнаружения изменений в ngOnChanges (поэтому анимация css перезапускается) - PullRequest
0 голосов
/ 28 февраля 2020

Допустим, у меня есть очень базовый c компонент, который принимает число в качестве входного значения и отображает его (например, значение цены акций). Когда это число увеличивается или уменьшается по сравнению с предыдущим значением, анимация должна отображаться в течение 10 секунд, а затем исчезать. Если входное значение изменяется в течение этих 10 секунд, анимация должна перезапуститься и скрыться через 10 секунд (или перезапустить еще раз, если значение снова изменится, и т. Д. c).

Я реализовал это для своего сценарий использования, использующий базовые c css анимации ключевых кадров. Возможно, это неправильный подход, но это проще, чем разбираться с библиотекой анимаций angular.

Я установил обязательный пример stackblitz, чтобы проиллюстрировать мою проблему. Если вы нажмете кнопку увеличения или уменьшения, дождитесь остановки подпрыгивания и затем снова нажмите эту кнопку, анимация не перезапускается.

Я решил эту проблему, используя setTimeout(() => {...}, 100) при изменении анимации. "назад к истине" (строки 26-33 из hello.component.ts), но это явно не angular способ сделать это.

Любое руководство будет оценено.

редактировать: забыл ссылку на стек: https://stackblitz.com/edit/angular-u9ogwv

...