如何在 table 中动态重新绘制数据。 Angular ngTable

Question

我的控制器只有 1 个函数 getList()。当我第一次调用它时 - 一切都很好，我的 table 显示正确的数据。但是当我再次调用此函数时（使用新参数以获得不同的数据作为响应），我仍然在 table 中有来自第一次调用的数据。如何reload/redraw/refresh数据？

    module.controller("IPsCtrl", function($scope, $filter, IPService, ngTableParams) {

    $scope.data_out = {
        'ip_pattern' : '%',
    };

    $scope.getList = function() {
        $scope.data=IPService.getList($scope.data_out,
            function(response) {

                $scope.tableParams = new ngTableParams({
                        page: 1,            // show first page
                        count: 10,          // count per page
                        filter: {
                             id: ''       // initial filter
                        },
                        sorting: {
                             id: 'asc'     // initial sorting
                        }
                    }, {
                      total: response.list.length, // length of data
                      getData: function($defer, params) {
                            // use build-in angular filter
                            var filteredData = params.filter() ?
                                      $filter('filter')(response.list, params.filter()) :
                                      response.list;
                            var orderedData = params.sorting() ?
                                      $filter('orderBy')(filteredData, params.orderBy()) :
                                      response.list;

                            params.total(orderedData.length); // set total for recalc pagination
                            $defer.resolve(orderedData.slice((params.page() - 1) * params.count(), params.page() * params.count()));
                    }
                });


            });
    };
});

这是html视图

<table ng-table="tableParams" show-filter="true" class="table">
                <tr ng-repeat="user in $data">
                     <td data-title="'Name'" sortable="'id'" filter="{ 'id': 'text' }">
                          {{user.id}}
                     </td>
                     <td data-title="'Age'" sortable="'value'" filter="{ 'value': 'text' }">
                          {{user.value}}
                     </td>
                </tr>
            </table>

Answer 1

提供了一种方法来做到这一点：

$scope.tableParams.reload();

更新 table 显示的数据后调用即可。

编辑：
首先，我认为您当前对 ngTable 的使用不正确。与其将 table 直接绑定到响应数据，我认为最好的做法是将您的响应数据存储在 $scope 变量中，然后将其附加到您的 ngTable。这样你只需要操作 $scope 数据并调用 reload。
从那里开始，只需更新存储的数据然后调用 reload:

// Store your data in a dedicated variable
$scope.myData = response.list;

// Update ngTable to reflect the new data
if ($scope.tableParams) {
    $scope.tableParams.reload();
} else {
    // create your table as before, 
    // but tying it to $scope.myData 
    // instead of response.list
}

如何在 table 中动态重新绘制数据。 Angular ngTable

How to dynamically re-draw data in table. Angular ngTable

angularjs

ngtable