NgTable 使用 API 和 groupBy 和全局过滤器答案

【问题标题】：NgTable using API and groupBy with a global filterNgTable 使用 API 和 groupBy 和全局过滤器
【发布时间】：2016-01-12 19:20:22
【问题描述】：

我在使用 NgTable 时遇到了困难，但是我正在寻找的功能可能是对表格框架的限制。

我在 getData 中使用 API 调用，并且正在对数据进行分组（通过设置参数中的 groupBy 属性）。

我希望能够对数据使用全局过滤器，但我似乎无法让它与分组一起使用。有两个例子，除了它们没有混合：

分组：http://ng-table.com/#/grouping/demo-grouping-basic
全局过滤：http://ng-table.com/#/filtering/demo-api

有什么建议吗？

表声明/配置

$scope.tableNotesParams = new ngTableParams({
    page: 1,   // show first page
    count: 10,  // count per page: use total result set in this case,
    sorting: {
        created_at: 'desc'
    }
}, {
    groupBy: function( note ) {
        return moment( note.created_at ).format( 'YYYY' );
    },
    getData: function ( $defer, params ) {

        $scope.request.notes.state = 'started';
        $scope.request.notes.notesSpinner = true;

        var offset = params.count() * ( params.page() - 1 );

        // Default
        var urlQueryParams = {
            'email': member.accounts.email,
            'offset': offset,
            'limit': params.count() || 10
        };

        notesApiService.getNotes( urlQueryParams ).then( function ( results ) {

            $scope.notes = results.data;
            $scope.noteMembers = extractionService.getAllUniqueMembers( $scope.notes );

            // Get the range values, expecting value to be: items 1-10/655
            var noteHeaders      = results.headers();
            var notesRangeValues = noteHeaders['content-range'].match( /(\d{1,})/g );

            $scope.tableNotesMetaData = {
                offsetStart: notesRangeValues[0] || 0,
                offsetEnd  : notesRangeValues[1] || 0,
                totalCount : notesRangeValues[2] || 0
            };

            // Update parent controller count
            $scope.tabs.notes.count = notesRangeValues[2] || 0;

            // Update the total
            params.total( $scope.tableNotesMetaData.totalCount );


            var orderedData = params.sorting() ?
                              $filter('orderBy')($scope.notes, params.orderBy()) :
                              $scope.notes;


            $defer.resolve( orderedData );

            $scope.request.notes.state = 'completed';
            $scope.request.notes.notesSpinner = false;

        });

    }
});

编辑：

全局过滤器的过滤示例不对分组数据做任何事情：

function applyGlobalSearch(){
  var term = self.globalSearchTerm;
  if (self.isInvertedSearch){
    term = "!" + term;
  }
  self.tableParams.filter({ $: term });
}

【问题讨论】：

分组的具体问题在哪里？
有什么进展吗？更多问题？
经过进一步审查，看起来整个架构应该有所改变。感谢您的帮助！运行 NgTable 的人对此有点失望，如果不围绕/在框架之外构建，就无法全局处理过滤分组数据。

标签： angularjs ngtable

【解决方案1】：

我认为在getData() 函数中查询您的notesApiService.getNotes() 并不高效，但无论如何。由于我们没有 HTML 或 JSBin 可以使用，它主要是猜测：

notesApiService.getNotes( urlQueryParams ).then( function ( results ) {
    var term = $scope.globalSearchTerm.toLowerCase();
    if (term.length == 0) {
        $scope.notes = angular.copy(results.data, []);
    } else if (term.length > 1) {
        $scope.notes = results.data.filter(function(item) {
            var val = JSON.stringify(item).toLowerCase();
            return (val.indexOf(term) != -1);
        });
    }

【讨论】：