1

I am working on quiz app. I have add the time out to every question even though user attempts the question or not.

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]);
        }

    }
}

Can any one suggest how to call time out from view?

3 Answers 3

8

Please find below the code

 function controller($scope) 
 {
   $scope.showflag = true;
   setTimeout(function () 
   {
     $scope.$apply(function()
     {
       $scope.showflag = false;
     });
   }, 1000);
 }
1
  • you should use $timeout rather than setTimeout so you can unit test your controller
    – eddiec
    Apr 16, 2015 at 12:35
0

You could use CSS transitions or animation to do the actual transition and use ngAnimate to trigger the transitions.

There are a few examples for ngAnimate on this page.

1
  • thanks but i have to add timeout. i am showing single question at a time when ever it crosses the time limit i have to show new question @TheHippo Aug 19, 2014 at 12:06
0

You can try this approach:

  • Modify your checkAnswer() code and call another function which sets the timeout/sleep. When the call returns from the timeout function, set a variable (eg. isVisible) to false and use this variable in ng-show. Something like this:

  • So, new ng-show would look like ng-show=" isVisible && opt._correct"

1
  • I have to call checkAnswer() on timeout Aug 19, 2014 at 14:22

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.