使用 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() 中的状态变量。