簡體   English   中英

數據更新后如何調用角度數據表分頁刷新回調?

[英]How invoke angular datatable pagination refresh callback after data update?

我有工作正常的角度數據表配置。 我的配置看起來像

  vm.dtOptions = DTOptionsBuilder.newOptions().
            withPaginationType('full_numbers').
            //withOption('ajax', {
            //    url: 'rest/get/'+entityName,
            //    type: 'GET'
            //}).
            withOption('serverSide', true).
            withOption('ajax', function(data, callback, settings) {
                    EntityManager.get({entity:entityName,action:'get',start:data.start,length:data.length}).$promise.then(function(response) {
                    console.log('response');
                    console.log(response);
                    vm.objectList = response.data;

                    callback({
                        recordsTotal:    response.recordsTotal,
                        recordsFiltered: response.recordsFiltered,
                        data: response.data
                    });

                });
            }).
            withDataProp('data').
            withOption('processing', true).
            withOption('bFilter', false).
            withOption('bSort', false).
            withOption("aaSorting", []).
            withDisplayLength(10);

但我也有更新數據和記錄recordsTotal過濾功能,因此,應該重新呈現分頁 - 必須修改最后一個按鈕編號。 但它不會發生。 有沒有辦法調用

 callback({
      recordsTotal:    response.recordsTotal,
      recordsFiltered: response.recordsFiltered,
      data: response.data
 });

從控制器? 什么對象和什么方法更新分頁?

好的,最后我找到了解決方案。 首先,在標記中添加 dt-instance:

 <div ng-controller="DataTableController as listTable" ng-init="init('informsystem')">
   <table datatable="" dt-options="listTable.dtOptions" dt-instance="listTable.dtInstance" class="row-border hover">

在控制器中聲明 dtInstance 變量並初始化它。 此外,獲取所有 ajax 回調邏輯以分離函數並將其傳遞到 dtoptions 和過濾器中:

 var vm = this;
 vm.dtInstance = {}; //MUST BE INITIALIZED! DON'T FORGET vm.(this) before varName

        var ajaxCallback = function(data, callback, settings) {
            $scope.filter.start = data.start;
            $scope.filter.length = data.length;
            console.log($scope.filter);
            EntityManager.get($scope.filter).$promise.then(function(response) {
                console.log('response');
                console.log(response);
                vm.objectList = response.data;

                callback({
                    recordsTotal:    response.recordsTotal,
                    recordsFiltered: response.recordsFiltered,
                    data: response.data
                });

            });
        };

在配置中使用 ajaxCallback:

   ....withOption('ajax', ajaxCallback ).....

在 doFilter/doSearch 中:

  $scope.doFilter = function () {
            console.log(vm.dtInstance);
            vm.dtInstance.changeData(ajaxCallback);
        };

$scope.filter 在 init 中填充,在回調中添加了 $resource 和 start 和長度(偏移量)的通用參數。 此外, filter 包含來自通過ng-model綁定的過濾器 html 輸入的值。

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM