时间戳

首页 > 解决方案 > 如果 angularJs 中的请求超过 30 秒，如何显示警报？

javascript - 如果 angularJs 中的请求超过 30 秒，如何显示警报？

问题描述

有时请求需要很长时间，我想在发生这种情况时显示一些警报或 toastr。知道如何捕捉请求时间吗？提前致谢

标签： javascriptangularjs

解决方案

你可以使用 promise $q，因为 promise 只能解决一次，并且在被拒绝后无法解决。在此示例中，使用输入指定在请求完成之前的等待时间（以秒为单位）。如果此时请求尚未完成，则会在 5 秒后显示警报。

angular.module("app", [])
  .controller("ctrl", function($scope, $timeout, $q) {
    $scope.wait = 0;

    $scope.request = function() {
      const timer = $q.defer();
      
      timer
        .promise
        .then(function(value) {
          alert(value);
        })
        // do nothing
        .catch(() => {});
      
      $timeout(function() {
        timer.resolve("Request takes too long");
      }, 5000);
      
      $timeout(function() {
        // Here your request resolves successfully
        console.log("Resolving request");
        timer.reject();
      }, $scope.wait * 1000);
    }
  });
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.7.5/angular.js"></script>
<div ng-app="app" ng-controller="ctrl">
  <input type="number" ng-model="wait">
  <button ng-click="request()">Click</button>
</div>

推荐阅读