javascript - 停止 AngularJS 中的 setTimeout 函数(提示 : use $timeout)

Question

我正在制作一个测验类型的应用程序，其中当用户提出问题时，10 秒的计时器如下所示:

$scope.timer2 = function() {
    setTimeout(function() {
        console.log('times up!!!!');
    }, 10000)
}

当问题出现时，它就会被调用，如下所示:

timerHandle = setTimeout($scope.timer2());

在执行此timer2之后，会弹出另一个问题，依此类推，弹出问题的另一种方式是用户选择一个选项，然后出现一个新问题。到目前为止一切顺利，但问题是，如果假设 5 秒过去了，然后用户选择一个选项，“timer2”仍然显示“times up!!”再过 5 秒，新问题的另一个计时器也显示“times up!!”如果用户没有选择任何选项。

我想说的是，当用户选择任何选项时，我希望 timer2 停止，然后我希望在新问题到达时再次调用此计时器。这是当用户选择一个选项时执行的 Angular 代码:-

 $scope.checkanswer=function(optionchoosed){
            $http.get('/quiz/checkanswer?optionchoosed='+ optionchoosed).then(function(res){
                if(res.data=="correct"){
                    $scope.flag1=true;
                    $scope.flag2=false;

                }else{
                    $scope.flag2=true;
                    $scope.flag1=false;
                }
                $http.get('/quiz/getquestions').then(function(res){
                console.log("respo");
                $scope.questions=res.data;
                clearTimeout($scope.timerHandle);  //not working
                timerHandle = setTimeout($scope.timer2());

Answer 1

您可以尝试使用AngularJS的服务$timeout 。然后按照以下思路做一些事情:

var myTimer = $timeout(function(){
                console.log("hello world")
             }, 5000);

     ....
$timeout.cancel(myTimer);