如何同时显示3个随机数和时间间隔

我的任务是从1到100生成3个随机数。每个数字都需要在2-5秒内生成。如何同时显示3个随机数和时间间隔

生成后，每个数字（连同其生成的秒数）都应该出现在屏幕上。所以，一个接一个（并非全部同时）数字应该出现在屏幕上。

我设法得到屏幕上的三个随机数字，但我无法获得屏幕上显示的秒数以及相应的数字。

<html> 
    <head> 
     <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css"> 
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular.min.js"></script> 
    </head> 
    <body ng-app="Lotery"> 
     <div class="container" ng-controller="MainController"> 
     <div class="row"> 
      <div class="col-lg-12"> 
      <h1>Three random numbers from {{ bottomNumber }} to {{ topNumber }}<small> (each in {{ minSeconds }} - {{ maxSeconds }} seconds)</small></h1> 
      <button class="btn btn-default" ng-click="firePromise()">Click to get the numbers</button> 
      <span ng-repeat="nr in resultNumbers track by $index"> 
       <h1>{{ nr }} </h1> 
      </span> 
      </div> 
     </div> 
     </div> 
    </body> 
    </html> 


angular.module('Lotery',[]); 

angular.module('Lotery').controller('MainController', function($scope, $q) { 

    $scope.topNumber = 100; 
    $scope.bottomNumber = 1; 
    $scope.maxSeconds = 5; 
    $scope.minSeconds = 2; 

    function getNumber(){ 
     var deferred = $q.defer(); 

     setTimeout(function(){ 
      $scope.randomNumber = Math.floor(Math.random() * ($scope.topNumber - $scope.bottomNumber + 1)) + $scope.bottomNumber;  
      $scope.seconds = 1000 * Math.floor(Math.random() * ($scope.maxSeconds - $scope.minSeconds + 1)) + $scope.minSeconds; 
      if(angular.isNumber($scope.randomNumber)){ 
       deferred.resolve($scope.randomNumber); 
      } else { 
       deffered.reject('Error'); 
      } 
     }, $scope.seconds); 

     return deferred.promise; 
    }; 

    $scope.firePromise = function(){ 
     $scope.resultNumbers = []; 

     var promise = getNumber(); 

     promise.then(function(success){ 
      $scope.resultNumbers.push(success); 
      return getNumber(); 
     }).then(function(success){ 
      $scope.resultNumbers.push(success); 
      return getNumber(); 
     }).then(function(success){ 
      $scope.resultNumbers.push(success); 
     }); 
    }; 

});

见我的笔：http://codepen.io/M4i4/pen/EjyMdY

来源

2015-05-19 Davo

偏题：“Lottery” – isherwood

假设你的逻辑为seconds是正确的，如何只解决从getNumber()功能的对象，而不是简单的数量，如：

deferred.resolve({ number: $scope.randomNumber, seconds: $scope.seconds/1000 });

然后在您的标记中：

<span ng-repeat="nr in resultNumbers track by $index"> 
    <h1>{{ nr.number }} - {{ nr.seconds }}</h1>   
</span>

您更新的CodePen

这就是说，某些逻辑似乎不正确。

来源

2015-05-19 17:35:20 Tom

你说得对秒钟的逻辑是正确的。两个括号丢失。所以，不是这样的：$ scope.seconds = 1000 * Math.floor（Math.random（）*（$ scope.maxSeconds - $ scope.minSeconds + 1））+ $ scope.minSeconds;但是像这样：$ scope.seconds = 1000 *（Math.floor（Math.random（）*（$ scope.maxSeconds - $ scope.minSeconds + 1））+ $ scope.minSeconds）; – Davo

如何同时显示3个随机数和时间间隔

回答

相关问题