AngularJS - необходимо автоматически менять состояния при задержке по таймеру

0

Я новичок в AngularJS и имею мое веб-приложение, использующее $stateProvider для перехода к различным состояниям, когда это необходимо.

Тем не менее, я пытаюсь найти способ, которым я могу прокручивать несколько разных состояний по таймеру. Например, когда приложение загружается первым, показывается страница Page 1, затем через 30 секунд показывается страница Page 2, еще 30 секунд показывают страницу, а затем вернитесь на страницу 1 и так далее...

Кто-нибудь знает, возможно ли это с помощью Angular и ui.router? Если да, не могли бы вы указать мне в правильном направлении пример или что-то еще.

  • 0
    $ timeout (function () {$ state.go (NEXT);}, 30000); в каждом контроллере
  • 0
    Я бы предложил $ интервал, поскольку я предполагаю, что есть условия, которые нарушат цикл? Если нет, и вы ищете простой цикл, то используйте $ timeout.
Показать ещё 5 комментариев
Теги:
angular-ui-router

1 ответ

1
Лучший ответ

Не совсем понятно, какая цель, но вы можете использовать $interval() в блоке run() если это предназначено для немедленного запуска... или даже если оно не предназначено для запуска сразу

как правило, стараются избегать помещать вещи в rootScope, но для этого необходим глобальный метод. Я не думаю, что это слишком плохо, и избегает необходимости добавлять повторяющийся код или вводить что-либо в контроллеры

angular
    .module('myApp',[])
    .run(function($rootScope, $interval, $state) {
        var routeIdx = 0,
            routes = ['state1', 'state2','state3'];
        var routeTimer;

        $rootScope.routeLoop = {
            stopTimer: function() {
                $interval.cancel(routeTimer);
            },

            startTimer : function() {                  
                routeTimer = $interval(nextRoute, 1000);
            }
        }

        function nextRoute() {
            routeIdx++;
            if (routeIdx === routes.length) {
                routeIdx= 0;                   
            }
             $state.go(routes[routeIdx]);
        }
        // start it up
        $rootScope.routeLoop.startTimer()
    });

Теперь у вас есть доступ к началу и остановке в любой точке разметки без необходимости добавлять кучу кода в каждый контроллер/директиву

<button ng-click="routeLoop.stopTimer()">Stop</button>

DEMO

  • 0
    Да. Это лучшее (без добавления кода в каждом ctrl) и более полное (разрешить запуск / остановка) решение, чем в моем комментарии. Это должен быть принятый ответ.
  • 0
    Как я могу получить эту процедуру для автоматического запуска? Тестирование этого фрагмента кода, кажется, не загружает какую-либо страницу для меня.
Показать ещё 4 комментария

Ещё вопросы

Сообщество Overcoder
Наверх
Меню