Question

以下是我在表格中加载数据的HTML代码。

<table id="users" class="dashboard-widget msbf-table" ng-table="usersTableParams" hide-pagination="false" show-filter="true">
                    <tr ng-repeat = "user in users" ng-click="usersClicked($event, user.userId);">
                        <td data-title="'User login'" sortable="'userLogin'" filter="{'userId' : 'text'}">{{user.userId}}</td>
                        <td data-title="'User role'" sortable="" filter="{'roleName' : 'text'}">{{user.roleName}}</td>
                    </tr>
                </table>

这是我在表格中填充数据的代码：

$scope.usersTableParams = new ngTableParams({
            page: startPage,
            count: rowsPerPage,
            sorting: {
                userId: 'asc'
            },
            filter: {
                userId: '',
                roleName:''
            }
        },
        {
            total: $scope.users.length,
            getData: function($defer, params){
                 // use build-in angular filter
                var orderedData = getFilteredSortedData($scope.users, params);
                //var orderedData = params.filter() ? $filter('filter')($scope.users, params.filter()) : $scope.users;
                //$scope.users = orderedData.slice((params.page() - 1) * params.count(), params.page() * params.count());

                params.total(orderedData.length); // set total for recalc pagination


                $defer.resolve(getSlicedData(orderedData,params));
            }
        });

var getFilteredSortedData = function(data, params) {
            if (params.filter()) {
                data = $filter('filter')(data, params.filter());
            }
            if (params) {
                data = params.sorting() ? $filter('orderBy')(data, params.orderBy()) : data;
            }
            console.log('Filtered Data: '+JSON.stringify(data));
            console.log('Filtered Data size: '+data.length);
            return data;
        };
        //slices the data for the current page, checked
        var getSlicedData = function(data, params) {
             var slicedData = data.slice((params.page() - 1) * params.count(), params.page() * params.count());
             console.log('Sliced Data: '+JSON.stringify(slicedData));
             console.log('Sliced Data size: '+data.length);
             return slicedData;
        };

问题是数据正确地传递给变量“sliceData”，但是，这并没有在HTML表格中填充。我怀疑是这条线：

$defer.resolve(getSlicedData(orderedData,params))'

无效。欢迎任何指示/想法。

谢谢＆amp;问候 Nishant Kumar

Answer 1

我终于弄清楚出了什么问题。

<table id="users" class="dashboard-widget msbf-table" ng-table="usersTableParams" hide-pagination="false" show-filter="true">
                <tr ng-repeat = "user in users" ng-click="usersClicked($event, user.userId);">
                    ....
                </tr>
            </table>

ng-repeat = "user in users"

应替换为

ng-repeat = "user in $data"

如果您正在使用

getData in ngTableParams

自定义正在显示的数据。

根据我的理解，这是因为getData（）函数将数据与$ data中的所有其他详细信息放在一起，而不是实际存储它的变量。此$ data变量负责在声明表的参数时基于为表指定的配置呈现的数据。希望你们都同意我的理解。由于我是Angular JS的新手，所以我可能根据错误的假设提供了解释，因此非常欢迎任何类型的更正，并感谢所有StackFlow关注者和贡献者帮助我。

Answer 2

您需要调用$ apply，或在调用resolve后触发摘要。

将getData更改为：

getData: function($defer, $timeout, params){
     // use build-in angular filter
    var orderedData = getFilteredSortedData($scope.users, params);
    //var orderedData = params.filter() ? $filter('filter')($scope.users, params.filter()) : $scope.users;
    //$scope.users = orderedData.slice((params.page() - 1) * params.count(), params.page() * params.count());

    params.total(orderedData.length); // set total for recalc pagination


    $defer.resolve(getSlicedData(orderedData,params));
    if (!$scope.$$phase) {
        $scope.$digest();
    }
}

你也可以尝试在$ timeout中包装$ defer.resolve，这会触发一个摘要 - 试试这个：

getData: function($defer, params){
     // use build-in angular filter
    var orderedData = getFilteredSortedData($scope.users, params);
    //var orderedData = params.filter() ? $filter('filter')($scope.users, params.filter()) : $scope.users;
    //$scope.users = orderedData.slice((params.page() - 1) * params.count(), params.page() * params.count());

    params.total(orderedData.length); // set total for recalc pagination


    $timeout(function() {
        $defer.resolve(getSlicedData(orderedData,params));
    })
}

您需要这样做的原因是angularJS的观察者不会选择同步代码。

AngularJS：$ defer.resolve（）没有将数据绑定到表

2 个答案: