AngularJS ng-show和$ timeout无法正常工作

时间:2016-08-10 16:54:15

标签: javascript angularjs

我是AngularJS的新手,正在使用ng-show和if else语句使用$ timeout在AngularJS中执行单个项目。但是,在显示几秒钟后,我无法得到超时的答案。我尝试了当前stackoverflow页面处理这个主题的组合,但没有。其他所有工作但超时能力。

--HTML----
       <form>
          <div class="form-group">
            <label>{{ question }}</label>
            <input type="text" class="form-control" ng-model="myAnswer"><!--angular directive-->
          </div>

        </form>
            <div ng-show="myquestion(myAnswer)"> <!--angular directive-->
                <h5>{{ ansConf }}</h5><!-- if answer equals blue whale return string-->
            </div>
            <div ng-hide="myquestion(myAnswer)">
                <h5>{{ wrongAns }}</h5>
            </div>
            </div>
            <div class="col-md-4 odb" ng-init="whaleOne = 'assets/img/site/2560 8.jpg'" >
                <a href="#" ng-click="infoOne()"> <!--angular directive-->
                <img class="img-thumbnail img-responsive" ng-src="{{ whaleOne }}"> <!--angular directive-->
            </a>
            </div>

--- AngularJS Code ---

var app = angular.module("bigBlue", []); /* New module called gamesite */

app.controller('whaleController', ['$scope', '$window', function($scope, $window, $timeout) { 

  $scope.question = 'Which whale is blue ?';
  $scope.rightAns = 'blue whale';
  $scope.wrongAns = 'nope';
  $scope.ansConf = 'Blue Whale is correct !';

  // setting value of the first question variable '' open string
  $scope.myAnswer = '';

  $scope.myquestion = function(myAnswer){
    if (myAnswer == $scope.rightAns){
      return true;
      $timeout(function () {
                $scope.myAnswer = false;
            }, 3000);
    }
    else if (myAnswer != $scope.rightAns){
      return false;
    }

  }

3 个答案:

答案 0 :(得分:1)

  

中断功能

     

函数会在调用返回的位置立即停止。

返回后,超时永远不会调用,最后移动

  if (myAnswer == $scope.rightAns){

      $timeout(function () {
                $scope.myAnswer = false;
            }, 3000);
     return true;
    }

答案 1 :(得分:0)

在你的“whaleController”中,在'$ window'之后添加Dependency'$ timeout',如下所示:

app.controller('whaleController', ['$scope', '$window', '$timeout', function($scope, $window, $timeout) { 

这样,它应该可以工作。

答案 2 :(得分:0)

您应该在return true;

之后替换$timeout