数据表未在angularjs中刷新

时间:2016-09-22 12:02:23

标签: javascript angularjs datatables

我从服务器调用中获取了大量数据,因此我决定使用angularjs使用数据表。实施时,我在每个分页呼叫中获得10条记录。 但问题是在点击下一个分页时它会带来数据并重新选择数据表但是在点击之前的分页时它会带来数据但不会重新选择数据表。 这是我的angularjs代码: -

appice.controller('appUsersController',
    function ($scope,appIceService, DTOptionsBuilder, DTColumnBuilder, $q) {

    function init(){
        $scope.getAppUsers();
    }

    //$scope.dtInstance = {};
    $scope.type = '';
    $scope.getAppUsers = function(type){
        $scope.type = type;
        $scope.dtOptions = DTOptionsBuilder.newOptions()
            .withFnServerData(serverData)
            .withOption('processing', true)
            .withOption('serverSide', true)
            .withOption('searchDelay', 350)
            .withPaginationType('full_numbers')
            .withDisplayLength(10);

        $scope.dtColumns = [
            DTColumnBuilder.newColumn('alias').withTitle('User'),
            DTColumnBuilder.newColumn('fs').withTitle('User Since'),
            DTColumnBuilder.newColumn('sc').withTitle('#of Sessions'),
            DTColumnBuilder.newColumn('ad').withTitle('Average Duration'),
            DTColumnBuilder.newColumn('ca').withTitle('Competing Apps'),
            DTColumnBuilder.newColumn('interest').withTitle('Interests'),
            DTColumnBuilder.newColumn('engage').withTitle('Campaign Engagement'),
            DTColumnBuilder.newColumn('cac').withTitle('CAC'),
            DTColumnBuilder.newColumn('ltv').withTitle('LTV'),
            DTColumnBuilder.newColumn('permission').withTitle('Permission')
        ];
    }

    $scope.getUsers = function(userType){
        $scope.getAppUsers(userType);
    }

    function serverData(sSource, aoData, fnCallback, oSettings) {
        //All the parameters you need is in the aoData variable
       /* var draw = aoData[0].value;
        var order = aoData[2].value;*/
        var start = aoData[3].value;
        //console.log('draw::'+draw+" order:"+order+" start:"+start);
        var length = aoData[4].value;
        var searchText = aoData[5].value.value;
        var promise = appIceService.getAppUsers($scope.type, start, length, searchText);
        promise.then(function(result) {
            if(result){
                var records = {
                        'draw': result.draw,
                        'recordsTotal': result.recordsTotal,
                        'recordsFiltered': result.recordsFiltered,
                        'data': result.data  
                    };
                //$scope.rerender();
                //$scope.dtInstance.rerender(); 
                fnCallback(records);
                $scope.$apply();
                //console.log('records:'+JSON.stringify(records));
            }
            else{
                console.log('else records::')
                fnCallback({});
            }            
        });
    }

    init();
});

这是我的HTML代码。

<table datatable="" dt-options="dtOptions" dt-columns="dtColumns" dt-instance="dtInstance" class="table table-striped table-bordered"></table>

在使用angularjs实现数据表时,我无法理解这里出了什么问题。

0 个答案:

没有答案