Angular范围输入值随秒变化

Question

我有一个看起来像这样的输入，它连接到每秒增加值的控制器。如果我将值设置为一个数字，页面将在加载时反映出来，但不会反映动态进行的更改。我是否必须使用 ng-model 来动态更改值？解决这个问题的最佳方法是什么？

    <div class="range">
        <input type="range" min="0" max="100" value={{getSeconds()}}">
    </div>

Answer 1

您可以尝试使用 $interval 来更新模型值吗？您也可以通过 cancel().

取消间隔

Answer 2

当您使用作用域函数调用绑定任何内容时 angular 无法监视它，因此不会更新该值。您必须将其更改为属性并使用 ng-model 进行设置，并使用 angular 的 $interval 更新属性值，以毫秒为单位传递所需的时间间隔。

Html

<input id="range" type="range" min="0" max="100" ng-model="counter" />

JS

  $scope.counter = 0;
  $interval(function () {
    $scope.counter++;
  }, 1000);

Angular range input value changing with seconds