2013-09-03 9 views
8

ページングとクライアント側の並べ替えを有効にしたng-gridを使用しています。列ヘッダーをクリックしてソートされたデータを取得すると、それは機能します。しかし、現在のページのデータのみをソートします。私は各ページをソートすることを意味します。すべてのデータを並べ替えて現在のページを表示したい。例えば、私がページ2にあり、idでソートすると、ページ1にID 5,7,10,11,12が表示され、ページ2にはID 1,2,6,8,9が表示されます。私は1ページに1,2,5,6,7、2ページには8,9,10,11,12を私に見せたい。どうすればこれを達成できますか?ページングを使用したAngularJS ngグリッドでデータ全体を並べ替える

ありがとうございました

答えて

14

ここで私はこの問題を解決しました。基本的な考え方は、配列を手動で並べ替えることです。配列にはすべてのデータが含まれ、改ページが再度行われます。

初期ソート値

$scope.sortInfo = {fields: ['id'], directions: ['asc']}; 

特定のフィールドにデータをソートする関数を定義
// sort over all data 
function sortData (field, direction) { 
    if (!$scope.allData) return; 
    $scope.allData.sort(function (a, b) { 
    if (direction == "asc") { 
     return a[field] > b[field] ? 1 : -1; 
    } else { 
     return a[field] > b[field] ? -1 : 1; 
    } 
    }) 
} 

sortInfoを見て、変更setPagingDataがある

// sort over all data, not only the data on current page 
$scope.$watch('sortInfo', function (newVal, oldVal) { 
    sortData(newVal.fields[0], newVal.directions[0]); 
    $scope.pagingOptions.currentPage = 1; 
    setPagingData($scope.pagingOptions.currentPage, $scope.pagingOptions.pageSize) 
}, true); 

に反応定義

// pick the slice we currently want to see 
function setPagingData (page, pageSize){ 
    if (!$scope.allData) return; 
    $scope.totalServerItems = $scope.allData.length; 
    $scope.myData = $scope.allData.slice((page - 1) * pageSize, page * pageSize);; 
}; 

はあなたのgridOptionsにsortInfoを設定

$scope.gridOptions = { 
    sortInfo: $scope.sortInfo, 
    useExternalSorting: true, 
} 
関連する問題