Question

我是AngularJS的新手，并且我的网络应用程序使用$stateProvider在需要时更改为各种状态。

但是，我试图找到一种方法，我可以在计时器上循环通过许多不同的状态。因此，例如，当应用程序首次加载时，显示Page1，然后在30秒后显示Page2，另外30秒显示Page 3然后返回到Page1，依此类推......

有没有人知道Angular和ui.router是否可行？如果是这样，请你用一个例子或其他东西指出我正确的方向。

Answer 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

AngularJS - 需要在定时器延迟时自动改变状态

1 个答案: