Question

我有一个小型的AngularJS应用程序，用于搜索和检索用户列表以及下次安排的会议（假设一个在接下来的8小时内安排），使用时间格式为UTC的服务器从服务器返回，以便于计算到当地时间。我编写了javascript以便能够计算剩余的时间，我没有写过或想出的是如何在Angular中执行此操作。

我想要完成的是能够在剩余时间内更新DOM，直到会议安排完成或会议开始前的剩余时间。如果使用$ timeout服务更新单个元素似乎很简单，但是我不清楚如何在一次ng-repeat中对几个项目一次完成此任务。

任何想法将不胜感激！谢谢！

Answer 1

在ng-repeat中，你将有一个项目列表。

<li ng-repeat="items" >{{ timeUntil(currentTime) }}</li>

尝试仅更新$ scope.currentTime并让每个项目都有timeUntil方法。您只需从超时更新$ scope.currentTime。 Angular会处理剩下的事情。

这里的关键是知道你只是放入一个“表达式”并且在角度中，表达式可能很复杂，甚至涉及函数调用。

Answer 2

重复的问题，在这里回答：https://stackoverflow.com/a/16204830/2275421

http://plnkr.co/edit/0JqK96irV4ETdWZYxO3P?p=preview

更改了html以引用一个不影响ng-repeat的单独数组：

<td>in {{_timeLeft[$index]}}</td>

更新如下：

$scope._timeLeft = [];

var intervalID = window.setInterval(function() {
    for (var i=0; i<$scope.items.length; i++) {
      $scope._timeLeft[i] = $scope.timeUntil($scope.items[i]._freeBusyTime);
    }
    $scope.$apply();
}, 1000);

注意$ scope。$ apply（）需要让Angular知道'_timeLeft'已被修改，它会更新对它的所有引用。

AngularJS ng-repeat中的多个倒计时

2 个答案: