如何检查屏幕高度以进一步$http请求

how to check screen height for further $http requests?

本文关键字:进一步 http 请求 高度 屏幕 何检查 检查      更新时间:2023-09-26

>假设一个函数检查屏幕高度并发出$http.get请求,直到它填满屏幕。

app.controller('HomeController', function ($scope, $timeout, Api) {
  function checkScreen () {
    $timeout(function() {
      //Firefox fix
      var html = document.getElementsByTagName('html')[0];
      if (html.scrollTop == 0) {
        html = html.getElementsByTagName('body')[0];
      }
      var scrollHeight = html.scrollHeight;
      var clientHeight = document.querySelector('body').clientHeight;
      var fromTime = Date.parse($scope.data[$scope.data.length - 1].value.date);
      if (clientHeight == scrollHeight) {
        $scope.fetcher(fromTime, checkScreen);
      }
    });
  }
  $scope.fetcher(0, checkScreen);
});

提取程序使用 API 服务处理$http请求

$scope.fetcher = function (fromTime, callback) {
  Api.post.getList(fromTime).then(function (result) {
    for (var i = 0; i < result.data.length; i++) {
      $scope.data.push(result.data[i]);
    };
    callback();
  });
}

此代码有几个不良做法问题:

  • 检查控制器中的 HTML/CSS 属性
  • 需要在控制器中对提取程序进行初始调用
  • 如果我需要在指令中调用 fetcher(如无限滚动追加器),该指令将与控制器紧密耦合。

我应该如何重构它来解决这些问题?
注意:$scope.fetcher 在每个控制器中都不同,但无限滚动指令对于所有控制器都是通用的。

我认为使用 Api 服务创建一个名为 Fetcher 的更具体的服务比在控制器中使用 $scope.fetcher 更好的解决方案。
这样,方向将不再与控制器紧密耦合
另外,检查屏幕作为 AngularJS 侧面的独特功能,并使用 Fetcher 服务在控制器中多次使用它返回的布尔值