时间戳

首页 > 解决方案 > 平滑的角度绑定更新

javascript - 平滑的角度绑定更新

问题描述

我正在尝试实现一个基于 Angular 的秒表，但我无法在不闪烁的情况下更新绑定。我希望秒表每秒计数。

为了更新秒表，我使用带有回调函数的 requestAnimationFrame。

private stopWatch() {
  const current = new Date();
  const count = +current - +this.ffCheckinTimestamp;
  this.timer = this.formatTime(count);
  this.timerAnimationId = requestAnimationFrame(this.stopWatch.bind(this));
}

<div style="margin-top: 30px;">
   <div class="text-center" style="font-size: 26pt;">{{timer}}</div>
</div>

在以下视频中，您可以很好地看到闪烁：www.ff-almoshof.de/flickering.mp4

有没有办法在不闪烁的情况下实现这一点？所有逻辑都在应用程序组件中。我可以通过在单独的组件中实现秒表来解决这个问题吗？

标签： javascripthtmlangularanimationrequestanimationframe

解决方案

推荐阅读