angularjs - 如何在 Angularjs 上使用 setInterval

Question

我正在编写一个小测验应用程序，我需要在其中向用户显示经过时间的计时器。我没有看到 setInterval() 的任何包装器。使用 window.setInterval 看起来很尴尬。是否有一种干净的 Angular 方式来更新时间？

Answer 1

我建议将“尴尬”代码包装在一些帮助模块中。请记住$apply()您的更改，以便 AngularJS 可以更新绑定。

// helper code
    var applyIfPossible = function (scope, fn) {
        if (!scope.$root.$$phase) {
            scope.$apply(function () {
                fn();
            });
        } else {
            fn();
        }
    };

    function setupInterval(scope, timeSpanInMilliseconds) {
        var intervalHandler = window.setInterval(function(){
            applyIfPossible(scope, intervalCallbackFn);
        }, timeSpanInMilliseconds);

        var unregisterDestroyHandler = null;
        unregisterDestroyHandler = scope.$on('$destroy', ()=> {
            window.clearInterval(intervalHandler);
            unregisterDestroyHandler();
        });

        scope = null;

        return function clearInterval() {
            unregisterDestroyHandler();
            window.clearInterval(intervalHandler);
        }
    }



// app code
var stopInterval = setupInterval(scope, 200, update); // update does you repeated stuff

// later on
stopInterval();