2013-04-24 4 views
1

У меня есть небольшое приложение AngularJS, в котором выполняется поиск и получение списка пользователей и их следующей запланированной встречи (при условии, что один из них запланирован в следующие 8 часов), возвращенный с сервера с помощью JSON с помощью формат времени в UTC для удобства расчета в местное время. У меня есть написанный javascript, чтобы иметь возможность рассчитать оставшееся время, что я не написал или не понял, как это сделать в Angular.AngularJS Множественные обратные отсчеты в ng-повторе

Я хотел бы выполнить, чтобы иметь возможность обновлять DOM со временем, оставшимся до завершения запланированного собрания, или время до начала собрания. Кажется прямо, если обновление одного элемента с использованием службы $ timeout, однако я не понимаю, как выполнить эту задачу в ng-repeat для нескольких элементов за раз.

Любые идеи были бы оценены! Благодаря!

ответ

2

В ng-repeat у вас будет список предметов.

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

Попробуйте обновить только $ scope.currentTime и дать каждому элементу метод timeUntil. Вы просто обновите $ scope.currentTime с вашего таймаута. Угловая будет обрабатывать остальные.

Главное, чтобы знать, что вы просто вставляете «выражение» и в угловом выражении может быть сложным, даже с вызовом функции.

+0

Это будет работать отлично, просто нужно установить $ timeout для обновления, и оно должно работать так, как я этого хочу. Не понял, что вы можете добавлять функции из контроллера в директиву ng-repeat. Благодаря! – Brian

2

дубликатом вопрос, ответил здесь: https://stackoverflow.com/a/16204830/2275421

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

изменил HTML сослаться на отдельный массив, который не влияет на нг-повтор:

<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' был изменен, и он обновляет все ссылки на него.