因此，我使用 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 事件永远不会触发，所以我永远不会知道是否有数据。它可能是没有数据或 GeoFire 仍在加载。如果我将 loader.hide() 方法放在 $scope.$on 内，那么当实际上没有数据时它永远不会触发。所以我的屏幕将永远加载。理想的用户体验应该是停止加载并提示人们增加搜索半径。如果我将 loader.hide() 放在 $scope.$on 之外，并设置 $timeout 来调用它。在 $timeout 运行之前，GeoFire 需要更长的时间来加载数据。因此，用户将提示更改半径屏幕，然后闪回到实际列表。再次糟糕的用户体验。那么...我的选择是什么？我可以在 GeoFire 中使用某种承诺吗？
Geofire 在以下情况下触发“查询就绪”事件：
所有当前数据已从服务器加载，并且所有初始事件已被触发。
See Geofire 文档的这一部分 https://github.com/firebase/geofire-js/blob/master/docs/reference.md#geoqueryoneventtype-callback.
那里的代码示例：
var onReadyRegistration = geoQuery.on("ready", function() {
console.log("GeoQuery has loaded and fired all other events for initial data");
});
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)
