표시 할 서버에서 오는 데이터가 있습니다. 이 데이터는 페이지가 매겨지고 정렬됩니다. 나는 데이터가 페이지에 표시되는 순서를 필터링하는 방법을 알아내는 몇 가지 도움이 필요페이지 매김 중에 angularjs에서 개체 정렬
<li class="list-group-item" ng-repeat="post in filteredPosts | orderBy:predicate:reverse">
<div class="row-fluid">
<div class="col-sm-1 ">
<p style="margin-top: 1em">{{($index + 1) + position}}.</p>
</div>
<div class="col-sm-1 v-center">
<a href="#" ng-click="voteUp(post)"> <i class="fa fa-angle-up"></i></a> <br />
<small>{{post.votes}}votes</small> <br />
<a href="#" ng-click="voteDown(post)"> <i class="fa fa-angle-down"></i></a>
</div>
<div class="col-sm-8">
<h4><a href={{post.url}}>{{post.title}}</a></h4>
<div>
<ul class="list-inline">
<li ng-repeat="tag in post.tags">
<span class="fa fa-tag"></span>
<button ng-click="getTags(tag.id)">{{tag.name}}</button>
</li>
</ul>
<div>
<em>{{ post.created_at | timeAgo}}</em>
by <cite>{{post.author.username}}</cite>
</div>
<div>
<a href ng-click="select(post)">
<span class="fa-stack fa-2x">
<i class="fa fa-comment fa-stack-2x"></i>
<strong class="fa-stack-1x fa-stack-text fa-inverse">
{{post.comments.length}}
</strong>
</span>
</a>
</div>
</div>
<div class="panel" ng-show="isSelected(post)">
<ul class="nav nav-list" ng-repeat="comment in post.comments">
<li class="list-group-item">
<strong><cite>{{comment.author.username}}</cite></strong>
{{comment.updated_at | timeAgo }}
<p>{{comment.message}}</p>
</li>
</ul>
<form name="CommentForm" novalidate role="form" ng-if="user.isLoggedIn" ng-submit="CommentForm.$valid && comment(post)">
<label for="InputComment">Add a Comment</label>
<textarea ng-model="newComment.message" class="form-control" id="InputComment" rows="3" required></textarea>
<button type="submit" class="btn btn-default">Submit</button>
</form>
</div>
</div>
</li>
<pagination total-items="totalItems" items-per-page="itemsPerPage"
ng-model="currentPage" ng-change="pageChanged()"></pagination>
: 여기
appControllers.controller('PostsCtrl',
['$scope', 'Restangular', 'messageCenterService',
'$location', '$anchorScroll',
'$filter',
function ($scope, Restangular, messageCenterService,
$location, $anchorScroll, $filter) {
// Get all posts from server.
var allPosts = Restangular.all('api/posts');
allPosts.getList().then(function (posts) {
$scope.posts = posts;
$scope.predicate = 'rank';
$scope.reverse = false;
$scope.itemsPerPage = 10;
$scope.currentPage = 1;
$scope.totalItems = $scope.posts.length;
$scope.pageCount = function() {
return Math.ceil($scope.totalItems/$scope.itemsPerPage);
};
$scope.$watch('currentPage + itemsPerPage',
function() {
var begin = (($scope.currentPage - 1) * $scope.itemsPerPage),
end = begin + $scope.itemsPerPage;
$scope.position = (10 * ($scope.currentPage - 1));
$scope.filteredPosts = $scope.posts.slice(begin, end);
$location.hash('top');
// call $anchorScroll()
$anchorScroll();
});
});
는 HTML입니다 다음과 같이 컨트롤러의 관련 부분입니다 . 나는 정렬에 관해 묻는 다른 질문을 읽었으나 내용이 어디에 있는지도 알지 못했다. 내가 갖고있는 질문은 서버에서 객체가 돌아와서 내용이 페이지 매김된다는 사실을 고려하여 라이브 필터를 수행하는 방법입니다.
덕분에이 답변에 대한 컨트롤러의 종속성으로 이미
$ 필터를 정렬도 프로그래밍 해 orderBy 필터를 사용할 수 있습니다, 이것은 내가 필요한 것입니다 . 오류가 발생했습니다 : [$ injector : unpr] 알 수없는 공급자 : inputProvider <- input <- pageFilter –
답변을 업데이트했습니다. 나는 수준 높은 기능을 잊어 버렸다. 그게 내가 그것을 테스트하지 못한 것에 대한 것입니다. –