понедельник, 7 апреля 2014 г.

AngularJS: Как можно сделать периодический таймер

Расскажу как я сделал таймер в проекте. Задача стоит такая: нужно с некоторой периодичностью получать некоторую информацию с сервера. Приступим.

Подключаем модуль в зависимостях $timeout и $rootScope.

В контроллере делаем следующее:

$scope.timerLoad=null;  // это объект таймера

$scope.timerLoadFunc=function(){
  $timeout.cancel($scope.timerLoad);
  $scope.timerLoad = $timeout(function() {
    $rootScope.$broadcast('timerLoadEvent');  // посылаем событие
    $scope.timerLoadFunc();
  }, 10000);  // каждые 10 секунд. в миллисекундах
}

$scope.timerLoadFunc();

Немного поясню. Мы создаем объект таймера и указываем функцию которая вызовется через 10000 миллисекунд. Причем функцию указываем саму на себя. В этой функции удаляем текущий таймер и создаем новый. Этим самым мы создаем периодическую генерацию события. Событие мы генерируем строкой  $rootScope.$broadcast('timerLoadEvent'); 
Это событие можно поймать в любом месте приложения. Вот так:

$scope.$on('timerLoadEvent',function(){
    console.log('timerLoadEvent');
});


Комментариев нет:

Отправить комментарий