从ng-repeat中删除顶部记录并根据滚动位置再次追加

时间:2017-09-27 12:02:18

标签: javascript html angularjs

我有一个加载大量数据的ng-repeat。我正在使用limitto过滤器来加载更多记录,每当我们滚动到页面底部时,这些记录会追加10条记录。添加新的10条记录时如何删除前10条记录。任何快速的解决方案将不胜感激。

 <ul class="lists">
    <li ng-repeat="item in items | limitTo:totalDisplayed">
     <span>{{item.name}}</span>
    </li>
     <li>
     <button ng-click='loadMore()'>Load More</button>
     </li>

</ul>


    $rootScope.totalDisplayed = 5;
    $rootScope.load_more = function () {
        $rootScope.totalDisplayed += 10;
    };

2 个答案:

答案 0 :(得分:1)

试试这个:

var app = angular.module('myApp', []);
app.controller('myCtrl', function($scope) {
	
    $scope.initial = 0;
    var limitStep = 10;
    $scope.limit = limitStep;
    $scope.incrementLimit = function() {
    	$scope.initial = $scope.limit;
        $scope.limit += limitStep;
    };
   
    $scope.decrementLimit = function(){
	    $scope.limit -= limitStep;
        $scope.initial -= 10;
};
   
    $scope.items = [{'name':'abc'},{'name':'abc'},{'name':'abc'},{'name':'abc'},{'name':'abc'},{'name':'abc'},{'name':'abc'},{'name':'abc'},{'name':'abc'},{'name':'abc'},{'name':'abc'},{'name':'bcd'},{'name':'bcd'},{'name':'bcd'},{'name':'bcd'},{'name':'bcd'},{'name':'bcd'},{'name':'bcd'},{'name':'bcd'},{'name':'bcd'},{'name':'cde'},{'name':'cde'},{'name':'cde'},{'name':'cde'},{'name':'cde'},{'name':'cde'},{'name':'cde'},{'name':'cde'},{'name':'cde'},{'name':'cde'},{'name':'cde'}]
});
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular.min.js"></script>
<div ng-app="myApp" ng-controller="myCtrl">
<ul class="lists">
    <li ng-repeat="item in items | limitTo: limit track by $index" ng-if="$index < limit && $index > initial">
     <span>{{item.name}}</span>
    </li>
</ul>	
<button ng-click='decrementLimit()' ng-disabled="initial===0">Load Previous</button>
<button ng-click='incrementLimit()' ng-disabled="limit===items.length-1">Load Next</button>        
</div>

希望有所帮助......

答案 1 :(得分:0)

其中一种可行的方法是ng-if:

select max(start_time)database,total,sum(CASE when status='Completed' then 1 else 0 end) as Completed,'< a href=''file:///C:/Users/kaushal.dave/ht_test/failed.txt''>LInks</a>' Failed,
(select count(status) from t1_exp where status not in ('Completed','Failed')) as In_queue,server
from T1_EXP group by database,total,server;