javascript - 使用 Angular 的 $timeout 刷新图像时取消新请求而不是当前加载的请求

Question

我使用 Angular 的超时以用户指定的时间间隔刷新图像的内容。当该间隔太短而无法加载图像时(例如 1 秒)，每个后续请求都会取消前一个请求，从而导致图像永远不会刷新。

我希望当前请求完成，并取消后续请求，直到请求冲突时该请求完成，而不是这种行为。我怎样才能做到这一点？

处理刷新的代码:

$scope.setImagePath = function() {
  $scope.imagePath = $scope.camera.endpoint + '?decache=' + Math.random();
};
$scope.setImagePath();

$scope.refreshOnInterval = function() {
  $timeout(function() {
    $scope.setImagePath();
    $scope.refreshOnInterval();
  }, $scope.refresh);
};
$scope.refreshOnInterval();

Answer 1

看看this question的回答。那里演示的事件将为实现提供基础。

我的建议是使用 imageonload 指令作为开始。使用图像的加载状态更新变量，而不是alert-ing某些内容。然后，在您的 $timeout 处理程序中，检查此状态变量，如果状态仍在加载，则不要调用 setImagePath()。您可能还需要更新 setImagePath() 中的状态变量。