angularJs及layui前端进行假分页

angularJs及layui前端进行假分页

当后台数据库不多，没必要进行后台数据库分页时，可能取到的数据在页面上一页也显示不了，所以要在前端的页面上进行一个假分页。

当angularJs的模型和layui的分页 插件结合起来使用时，ui页面中绑定的model数据无法被感知，因此在点击下一页的时候页面的数据并没有更新，即使model里的数据已经更新了。所以在这给大家介绍一下如何处理这种问题。

html代码：

<tbody ng-repeat="arranges in arrangeList">
	<tr></tr>
<tbody>

js代码：

layui.use(['laypage'],function(){
	var laypage = layui.laypage;
	var pageSize = $scope.params.pageSize;
	laypage({
	    cont: 'page',
	    pages: Math.ceil($scope.allArrangeList.length/pageSize), //得到总页数
	    skip: true,
	    jump: function(obj){
	    		$scope.arrangeList = $scope.allArrangeList.concat().splice(obj.curr*pageSize-pageSize, pageSize);		    			     
	    }
	});
});

用以上的js代码，在html页面中点击下一页，数据是不会更新的。
正确的js写法代码是：

layui.use(['laypage'],function(){
	var laypage = layui.laypage;
	var pageSize = $scope.params.pageSize;
	laypage({
	    cont: 'page',
	    pages: Math.ceil($scope.allDataList.length/pageSize), //得到总页数
	    skip: true,
	    jump: function(obj){
    		$timeout(function(){
	    		$scope.dataList = $scope.allDataList.concat().splice(obj.curr*pageSize-pageSize, pageSize);
	    	},20)				    			     
	    }
	});
});

给数据加个延时触发，数据的变化就会被感知得到。