javascript - php 和 angularjs 有限的分页偏移量

Question

PHP (Laravel 4.2)

//PHP function
$rowsPerPage = 50;
$num = 1;
$offsets = ($num - 1) * $rowsPerPage; 
$data['trans'] = Transaction::withoutBranch()
->select('id', 'amount')
->where('payment_date', '>=', '2019-05-06')
->limit($rowsPerPage)
->offset($offsets)
->get();

在 PHP 中，数据库中的记录总数为 100。我做了一个查询以限制第一页的 50 条记录，然后几秒钟内限制 50 条记录。

AngularJS

 //api call from PHP funtion
 fetchTrx: function (data) {
       return api.call('api/bank_recon/fetch_trx', data);
            },

 //controller
 .controller('bankReconCtrl', function ($scope, $state, Module, 
CSRF_TOKEN, toastr, $controller, actionBar, $compile,DTOptionsBuilder) {

 var vm = this;
        vm.dtOptions = DTOptionsBuilder.newOptions()
            .withOption('ajax', {
                // Either you specify the AjaxDataProp here
                url: 'api/bank_recon/fetch_trx',
                type: 'POST',

            })
            .withDataProp('data')
            .withOption('processing', true)
            .withOption('serverSide', true)
            .withPaginationType('full_numbers');

 ////api call from PHP funtion
 $scope.fetchTrx = function () {
            Module.fetchTrx({
                month: $scope.item.month,
                year: $scope.item.year,
                account_id: $scope.item.account_id,
                page_number: $scope.item.page_number
            }).then(function(res) {
                angular.forEach(res.trans, function (trx) {

                });

                $scope.trans = res;
                console.log($scope.trans);
                $scope.item.reconcile_date = res.reconcile_date;
                // console.log($scope.trans.photos);
                $scope.item.actual_balance = 
Math.roundCurrency(res.actual_balance);
                $scope.item.end_balance = 
Math.roundCurrency(res.end_balance);
                $scope.form.$setPristine();
            }).finally(function () {
                // calculate
                $scope.calBalance();
            });
        };

我的期望是页面将首先加载 50 条记录，然后当用户单击第二页时，将从服务器加载 50 条记录。这是为了避免大量记录同时渲染导致页面滞后。所以。

我使用 I-lin angularjs 数据表服务器端处理来实现我的期望。到目前为止，数据表只显示 50 条记录，而不是总共 100 条记录。

标签： javascriptphpangularjslaravel