javascript - 如何在 Angular 中编写代码setinterval和clearinterval

Question

我正在编写用于显示隐藏加载器 gif 和相应数据的功能，在 Angular 上，纯 javascript setInterval 代码不适用于 $scope.showLoader=true 和 $scope.showResult = true;最后一条语句 console.log('found the ...') 有效，但前 2 条语句(显示隐藏)无效。装载机一直旋转，数据不显示。 Angular $setTimeout 会起作用吗？

        $scope.showLoader = true;
        $scope.showResult = false;

        var timer = setInterval(function(){

            if($scope.resultArray.length == 4) {
                clearInterval(timer);
                $scope.showResult = true;     // doesn't work               
                $scope.showLoader = false;    // doesn't work
                console.log('found all search results'); // it works

            }

        },200);

Answer 1

我相信这是一个经典问题。 Angular 不知道您的变量 showLoader 和 showResult 已经在计时器内更新。所以，你需要让 Angular“知道”。您需要在设置这些变量后设置 $scope.$apply() 。这将工作!希望对你有帮助。

    $scope.showLoader = true;
    $scope.showResult = false;

    var timer = setInterval(function(){

        if($scope.resultArray.length == 4) {
            clearInterval(timer);
            $scope.showResult = true;     // doesn't work               
            $scope.showLoader = false;    // doesn't work
    $scope.$apply();
            console.log('found all search results'); // it works

        }

    },200);