如何判断请求/承诺是否需要超过5秒才能完成,angular js

how to tell if a request/promise takes longer than 5 seconds to fulfill, angular js

本文关键字:5秒 js angular 判断 何判断 请求 是否 承诺      更新时间:2023-09-26

我是一名新的开发人员,正在尝试检查5秒钟后是否没有解决promise。在不创建新指令/服务/工厂的情况下,最可读的方法是什么?这就是我所尝试的,我的主要问题是,当promise变量被实例化时,我是否在正确的时间设置了间隔?

  $scope.promiseTimeLimit = false;
      //if the promise does not return within 5 seconds, show a "service down" warning.
      var promise = service.checkValidRailCar($scope.railcar.number, $scope.railcar.initials);
      $interval(function () {
        $scope.promiseTimeLimit = true
      }, 5000)
      if ($scope.promiseTimeLimit) {
        $scope.message = {
          content: [{
            title: '',
            msg: 'The Service Is Down'
          }],
          type: 'error'
        };
        return;
      }
      promise.then(function (data) {
        if (!data.valid) {
          $scope.invalidData = true;
          $scope.message = {
            content: [{
              title: '',
              msg: 'Invalid: This is not a valid data and can not be created.'
            }],
            type: 'error'
          };
        } else {
          $scope.invalidData = false;
        }
      })

是的,您已经在promise实例化后正确设置了间隔。但是,我认为您不想在这里使用$interval。您可能需要使用$timeout。除非清除$interval,否则$interval中的回调函数将被反复调用。$timeout中的回调函数将只被调用一次。如果只想检查一次承诺是否在5秒内得到解决,则应使用$timeout

第二件事是关于以下代码:

if ($scope.promiseTimeLimit) {
    $scope.message = {
      content: [{
        title: '',
        msg: 'The Service Is Down'
      }],
      type: 'error'
    };
    return;
}

您需要将此代码保存在$timeout函数中。为了更好地理解,我将变量名$scope.promiseTimeLimit更改为$scope.promiseComplete,并将其初始化为$scope.promiseComplete = false

$timeout(function () {
    if(!$scope.promiseComplete) {
        $scope.message = {
          content: [{
            title: '',
            msg: 'The Service Is Down'
          }],
          type: 'error'
        };
     }
}, 5000);

然后,在promise.then函数(resolve)中,需要将$scope.promiseComplete设置为true。

promise.then(function (data) {
    $scope.promiseComplete = true;
    if (!data.valid) {
      ...
})

那么,这里发生了什么$timeout回调函数将在5秒钟后调用。它将检查$scope.promiseComplete是否为false。如果为false,则生成一条警告消息。如果是真的,什么也不做。在promise.then中,我们将$scope.promiseComplete设置为true。因此,如果promise.then函数(resolve)在调用$timeout回调函数之前将$scope.promiseComplete设置为true,则意味着promise在5秒内完成。

我创建了一个示例plunker来理解这种行为。你可以在这里看看。

IMHO,承诺超时应该实现为拒绝,并且像承诺一样,应该在尽可能低的级别上实现。

事实上,异步超时实际上是racewindow.setTimeout()的一种承诺,无论您想调用什么异步服务方法。

你可以这样写,例如:

service.checkValidRailCarWithTimeout = function(t, railcarNumber, railcarInitials) {
    // range checks
    if(t === undefined || railcarNumber === undefined || railcarInitials === undefined) {
        return $q.reject(new RangeError('Invalid parameter(s)'));
    }
    // race - timeout versus service call
    return $q(function(resolve, reject) {
        var tRef = window.setTimeout(function() {
            reject(new Error('The Service Is Down');
        }, t);
        function kill() {
            window.clearTimeout(tRef);
        };
        service.checkValidRailCar(railcarNumber, railcarInitials).then(resolve, reject).then(kill, kill);
    });
};

并按如下方式调用:

var promise = service.checkValidRailCarWithTimeout(5000, $scope.railcar.number, $scope.railcar.initials).then(function(data) {
    $scope.invalidData = !data.valid;
    if (!data.valid) {
        throw new Error('Invalid: This is not a valid data and can not be created.');
    }
}).catch(function(error) {
    $scope.message = {
        content: [{
            title: '',
            msg: error.message
        }],
        type: 'error'
    };
});

注:

  • $scope.promiseTimeLimit需求消失
  • kill()并不是绝对必要的,但它通过清除输掉比赛的潜在胆小鬼来保持清白
  • $scope.message = ...表达式将显示error传递的任何消息