我目前正在开发一个离子应用程序并成功实现了无限滚动功能.它适用于桌面浏览器和较新的Android设备,但是,我遇到运行Android 4.1或更低版本的手机的问题.
问题:
我打开页面,它加载并显示前20项正常,我滚动到底部,接下来的20项加载,但它不让我滚动任何进一步看到接下来的20项.
这是一个GIF,显示它在我的桌面上的样子(它应该工作的方式).桌面GIF
这是另一个GIF显示它在我的xperia手机上的外观(注意它不会让我在新装的物品上进一步滚动).xperia gif
然而,当我刷新页面,或者在接下来的20个项目加载后将手机变成横向模式时,滚动效果很好所以看起来手机不知道当新项目加载时屏幕高度发生了变化,所以我想我可以通过简单地添加 $ionicScrollDelegate.resize(); 告诉视图重新计算其容器的大小来修复它,但这似乎也没有解决它.
这是我的JavaScript代码:
.controller('TestCtrl', ['$scope', '$http', function($scope, $http) {
$scope.items = [];
$scope.page = 1;
$scope.totalPages = 1;
$scope.loadMore = function() {
if ($scope.page <= $scope.totalPages) {
$http.get('http://localhost/test/recent/' + $scope.page).success(function(items) {
var i = items.data.length;
$scope.totalPages = items.pages;
$scope.items = $scope.items.concat(items.data);
$scope.$broadcast('scroll.infiniteScrollComplete');
$scope.page = $scope.page + 1;
if ($scope.page == $scope.totalPages + 1) {
$scope.noMoreItemsAvailable = true;
}
});
}
}
}])
Run Code Online (Sandbox Code Playgroud)
HTML:
<ion-view view-title="Hello Stackoverflow">
<ion-content>
<a class="item" ng-repeat="item …Run Code Online (Sandbox Code Playgroud)