検索ボックスに基づいてフィルター処理するグループ化された要素があります。フィルターは機能しますが、フィルター処理された要素を含まないページの白いページを表示するページネーションに問題があります。ページ 1 にいて、ページ 2 にある要素を検索すると、ページ 1 は白のままで、手動でページ 2 に切り替える必要があります。
フィドル: http://jsfiddle.net/Tropicalista/qyb6N/9/
// create a deferred object to be resolved later
var teamsDeferred = $q.defer();
// return a promise. The promise says, "I promise that I'll give you your
// data as soon as I have it (which is when I am resolved)".
$scope.teams = teamsDeferred.promise;
// create a list of unique teams
var uniqueTeams = unique($scope.players, 'team');
// resolve the deferred object with the unique teams
// this will trigger an update on the view
teamsDeferred.resolve(uniqueTeams);
// function that takes an array of objects
// and returns an array of unique valued in the object
// array for a given key.
// this really belongs in a service, not the global window scope
function unique(data, key) {
var result = [];
for (var i = 0; i < data.length; i++) {
var value = data[i][key];
if (result.indexOf(value) == -1) {
result.push(value);
}
}
console.log(result)
console.log(Math.ceil(result.length / 10))
$scope.noOfPages = Math.ceil(result.length / 10);
return result;
}
$scope.currentPage = 1;
$scope.pageSize = 5;
$scope.maxSize = 2;
[編集]
検索入力の変化を監視する関数を作成しました。
$scope.$watch('searchInput', function () {
$scope.currentPage = 1;
$scope.teams = $filter('filter')($scope.teams, $scope.searchInput);
$scope.noOfPages = Math.ceil($scope.teams.length / $scope.pageSize);
});