2014-04-08 3 views
0

크기 조정시 가장 좋은 방법은 ng-repeat에서 볼 수있는 영역을 제한하는 것입니다. 나는 통해 테스트 데이터를 가져올 때, 그러나각도가 큰 json 파일

<li ng-repeat="lister in videos | filter:query | orderBy:orderProp | limitTo:20" 
       class="video_link"> 
    <p class="background_435F2C"> 
     <a id="{{lister.id}}" href="#/videos/{{lister.id}}">{{lister.name}}</a> 
    </p> 
</li> 

: 나는 (이 진정한 limitTo ... 아직 무한 스크롤 또는 아무것도, 그리고) limitTo에 의해이 경우에는 (내가 믿는) 것을 완료했습니다 20,000 개의 간단한 레코드가있는 JSON 파일, 연관된 쿼리 필터 (표준 Angular 쿼리 만, 아무 것도 없음)의 응답 시간이 줄어 듭니다. 입력 내용을 입력 할 때 눈에 띄는 지연이 있습니다.

의견이 있으십니까? 이 모범 사례처럼 큰 JSON 파일을 필터링하고 있습니까? 아니면 실제로/검색 페이지로 이동하여 서버 측에서 수행해야하는 작업입니까?

감사합니다.

답변

2

사용자의 경우 HTML이 아닌 컨트롤러의 JS 코드에서 필터링을 수행하십시오 (HTML의 경우 결국 두 번 실행되므로). HTML에서 다음

// inject $filter into controller 
.controller('MyCtrl', ['$scope', '$filter', function ($scope,$filter) { 
... 

var filterFilter = $filter('filter'); 
var orderByFilter = $filter('orderBy'); 
var limitToFilter = $filter('limitTo'); 

var tmp = filterFilter($scope.videos , $scope.query); 
tmp = orderByFilter(tmp, $scope.orderProp); 
$scope.videosPreFiltered = limitToFilter(tmp, 20); 

<li ng-repeat="lister in videosPreFiltered class="video_link"> 
    <p class="background_435F2C"> 
     <a id="{{lister.id}}" href="#/videos/{{lister.id}}">{{lister.name}}</a> 
    </p> 
</li>