Question

我想使用angular-svg-round-progressbar作为一种onMouseDown计时器，这样在进度条完成动画到新的“当前”值之前，函数不会执行。渲染选项似乎在渲染svg时触发，这不是我在这种情况下所寻找的。有没有办法在设置新的“当前”值并且动画完成对新值的更新后调用函数？

这是我目前的html：

<div class="progress-wrapper">
  <a href="#/track"
      class="button padding homebutton"
      ng-click="onClickFunction(type.id)"
      ng-mousedown="startButton(type.id)"
      ng-repeat="type in types">

    <div class="progress ng-cloak top-center">
      <i class="icon {{type.icon}}"></i>
      <br/>{{type.title}}
    </div>
    <round-progress
      max="10"
      current="type.pressed"
      color="#45ccce"
      bgcolor="#eaeaea"
      radius="55"
      stroke="12"
      semi="false"
      rounded="false"
      clockwise="true"
      responsive="false"
      duration="1800"
      animation="easeInOutQuart"
      on-render="buttonOnRender(progress, options, root)"
      animation-delay="0"></round-progress>
  </a>
</div>

这会产生一个漂亮的按钮，中间有一个图标和文字，当按下按钮时，我可以轻松地提示某些动作。但我想做的是将动作延迟到完成动画之后。

感谢您的想法。

更新：所以我认为一个解决办法可能仍然是触发ng-click或ng-mousedown但是然后在其中一个函数中延迟“持续时间”值，但这似乎不是很干净我

有没有办法知道angular-svg-round-progressbar何时完成动画？

0 个答案: