如何在angular js中为ng-show添加超时

Question

我正在测试应用程序上工作。我已经添加了每个问题的超时时间，即使用户尝试问题与否。

my code in view:

<p ng-repeat="opt in question.answer">      
    <label ng-show="opt._correct" for="">
    <input type="radio" name="questionAnswer" id="opt.id" value="" 
        ng-click="checkAnswer(1)" />
    {{opt.__text}}
    </label>
    <label ng-hide="opt._correct" for="">
    <input type="radio" name="questionAnswer" id="opt.id" value="" 
        ng-click="checkAnswer(0)" />
    {{opt}}
   </label>
</p>

my code in controller:

$scope.randomQuestions = function(questionslist){
    $scope.randomQuestion = questionslist
            [Math.floor(Math.random() * questionslist.
                length)];
            console.log($scope.quiz);
            var item = $scope.quiz.splice($scope.randomQuestion,1)[0];
        $scope.questions = new Array();
        $scope.questions.push($scope.randomQuestion);
                    $scope.counter = $scope.counter + 1;
        return $scope.questions;
}
$scope.checkAnswer = function(option){
        console.log('check answer');
        if(option == 1){
            console.log($scope.score);
            $scope.score = $scope.score + parseInt($scope.level._points_per_question);
             console.log($scope.score);
        } else{
        }
        console.log($scope.counter);
        if ($scope.counter < parseInt($scope.level._total_questions + 1)){
            $scope.randomQuestions($scope.quiz);
        } else {
            console.log('5 questions');
        }
}
$scope.nextLevel = function(){
    $scope.total_score = $scope.total_score + $scope.score;
    $scope.score = 0;
    $scope.counter = 0;
    if($scope.level_count == 1){
        $scope.level_count = $scope.level_count + 1;
        $scope.quiz = $scope.quiz2.question;
        $scope.level = $scope.quiz2;
        $scope.randomQuestions($scope.quiz);
    } else if($scope.level_count == 2){
        $scope.quiz = $scope.quiz3.question;
        $scope.level = $scope.quiz3;
        $scope.randomQuestions($scope.quiz);
        $scope.level_count = $scope.level_count + 1;
    } else {
        $scope.level_count = $scope.level_count + 1;
        $scope.result_text();
    }
}
  $scope.result_text = function(){
    $scope.result = parseInt(($scope.total_score * 100) / 400);
    for(var k=0; k < $scope.score_rules.length; k++){
        if($scope.result >= $scope.score_rules[k]._min_percent){
            $scope.score_status = $scope.score_rules[k].__text;
            console.log($scope.score_rules[k].__text);
            console.log($scope.score_rules[k]);
        }
    }
}

谁能告诉我如何从视图中调用time out ?

Answer 1

请查看下面的代码

 function controller($scope) 
 {
   $scope.showflag = true;
   setTimeout(function () 
   {
     $scope.$apply(function()
     {
       $scope.showflag = false;
     });
   }, 1000);
 }

Answer 2

你可以使用CSS过渡或动画来完成实际的过渡，并使用ngAnimate来触发过渡。

本页有几个ngAnimate的例子

Answer 3

您可以尝试以下方法:

• 修改您的checkAnswer()代码，调用另一个函数设置超时/睡眠。当调用从超时函数返回时，设置a变量(如。isVisible)到false，并在ng-show中使用该变量。像这样:

• 所以，新的ng-show看起来像ng-show=" isVisible && opt._correct"