angularjs ui-scroll 手机端页面应用,反向页面刷新不全问题,非无极滚动

想要查看一定缓存的数据,根据滚动进行书籍填充,可以使用ui-scroll,但是碰到了一个问题,

当往回滚动的时候,index会产生负值,如果不进行处理,直接返回空数组,则有几行数据会刷新不到,

摸索了一下午,使用取index的绝对值和count比较,如果小于count,则取0到count-Math.abs(index)条数据进行返回,即可解决回拉刷新数据不全的问题。

html代码:

<div class="book-mobile-list-height" ui-scroll-viewport>
<ul class="mes_newsbox clear" ng-click="vm.toDetails(item)" ui-scroll="item in datasource"
adapter="adapter" start-index="0" min-index="0" buffer-size="5">
<li class="newslist clear">
<div class="left numberImg">
<img class="full-width" ng-src="{{item.img}}" alt="">
</div>
<div class="right">
<h5>{{item.name}}</h5>
<p class="content col-xs-12" class="content">状态:{{item.stateName}}</p>
<p class="content col-xs-6">借阅人:{{item.createUserName}} </p>
<p class="content col-xs-6"> 时间:{{item.createdAt | date: 'yyyy-MM-dd'}}</p>
</div>
<div class="gray"></div>
</li>
</ul>
</div>


js代码
datasource.get = function (index, count, success) {
if (index >= 0) {
mcurdService.res.find('bookTask', {
offset: index, limit: count,
where: {
createUserId: appService.user.id
},
order: 'createdAt desc'
}).then(function (result1) {
result1.forEach(function (item) {
item.createdAt = new Date(item.createdAt);
item.img = item.ffImg[0] || '/modules/community_massesapp/client/img/微心愿/微心愿默认.png';
});
success(result1);
}).catch(function (err) {
$log.error('get ' + 'comm_dj_LittleWish' + ' error:' + err);
});
} else if (Math.abs(index) < count) {
mcurdService.res.find('bookTask', {
offset: 0, limit: count - Math.abs(index),
where: {
createUserId: appService.user.id
},
order: 'createdAt desc'
}).then(function (result1) {
result1.forEach(function (item) {
item.createdAt = new Date(item.createdAt);
item.img = item.ffImg[0] || '/modules/community_massesapp/client/img/微心愿/微心愿默认.png';
});
success(result1);
}).catch(function (err) {
$log.error('get ' + 'comm_dj_LittleWish' + ' error:' + err);
});
} else {
success([]);
}
};
posted @ 2023-05-17 16:08  夏几把狂舞  阅读(63)  评论(0)    收藏  举报