我什么时候知道GeoFire已完成加载,因为它是基于事件的触发器

时间:2015-10-08 00:58:55

标签: angularjs firebase angularfire geofire

所以我使用GeoFire和AngularFire来填充我的ng-repeat项目列表。有一个离子拉动刷新列表。因此,用户将其拉出并获取当前更新的位置并刷新列表(回想一下GeoFire以重新填充列表)。



$scope.doRefresh = function() {
  if ($scope.doneLoading) {
    $scope.useCurrentLocation().then(function() {
      $scope.userCurrentLocation = {
        lat: geoLocation.getGeolocation().lat,
        lng: geoLocation.getGeolocation().lng
      }

      angular.forEach($scope.tasks, function(child) {
        child.$destroy();
      });

      setupTaskListing();

      $scope.$broadcast('scroll.refreshComplete');
    })
  }
}

function setupTaskListing() {
  console.log("setupTask is being called");
  if ($scope.tasks.length > 0) {
    console.log("task is not empty!");
    $scope.tasks = [];
  }
  if ($scope.query) {
    console.log("$scope.query is not empty:" + $scope.query);
    $scope.query.cancel();
  }
  var radiusInMiles = ($scope.radius) * 1.60934;
  $scope.query = taskService.setGeoQuery($scope.userCurrentLocation.lat, $scope.userCurrentLocation.lng, radiusInMiles); //My service to set Geo Query.
  var geoQueryCallback = $scope.query.on("key_entered", "SEARCH:KEY_ENTERED");
}

$scope.$on("SEARCH:KEY_ENTERED", function(event, key, location, distance) {

  //my service to get a single task. It return a firebase object. So I use $loaded
  var task = taskService.getTask(key);
  task.$loaded().then(function(data) {            
    data.distance = parseInt(distance * 0.621371192);
    data.id = data.$id;
    $scope.tasks.push(data);
  });
});




正如您看到上面的代码,非常直截了当。 doRefresh()调用setupTaskListing()。并设置geoQueryCallback,当键输入事件时,将新数据推送到$ scope.tasks数组中。所以它有效。

但是这个GeoFire结构的问题是......我不知道所有任务何时完成输入半径......所以当半径内没有数据时,我无法设置加载器并提示。当没有数据输入时,key_entered事件永远不会触发,所以我永远不会知道是否有数据。它可以是NO数据或GeoFire仍在加载。如果我将loader.hide()方法放在$ scope。$ on中,那么当实际上没有数据时它将永远不会触发。所以我的屏幕将永远加载。理想的UX应该是停止加载并提示人们增加搜索半径。如果我将loader.hide()放在$ scope。$ on之外,并使用set $ timeout来调用它。在$ timeout运行之前,GeoFire需要更长时间才能加载数据。因此,用户将提示更改半径屏幕,然后闪回实际列表。再次破坏用户体验那么......我的选择在哪里?我可以在GeoFire中使用某种承诺吗?

1 个答案:

答案 0 :(得分:3)

Geofire激发了一个" Query Ready"事件时:

  

所有当前数据都已从服务器加载,并且所有初始事件都已被触发。

请参阅this section of the Geofire documentation

来自那里的代码示例:

var onReadyRegistration = geoQuery.on("ready", function() {
  console.log("GeoQuery has loaded and fired all other events for initial data");
});