Angular jsでng-repeatが正しく更新されていません

Question

ng-repeatとページ番号を付けようとしています。結果を得るには古いデータが表示され、突然ジャークなどの新しい設定データが表示されて表示されます。私のangularjsのバージョンは "1.5.8"です。

$scope.gap = 5; 

     $scope.filteredItems = []; 
     $scope.groupedItems = []; 
     $scope.itemsPerPage = 5; 
     $scope.pagedItems = []; 
     $scope.currentPage = 0; 
     var resultData = [...]; 
     var searchMatch = function (haystack, needle) { 
      if (!needle) { 
       return true; 
      } 
      return haystack.toLowerCase().indexOf(needle.toLowerCase()) !== -1; 
     }; 

     // init the filtered items 
     $scope.search = function() { 
      $scope.filteredItems = $filter('filter')(resultData, function (item) { 
       for(var attr in item) { 
        if (searchMatch(item[attr], $scope.query)) 
         return true; 
       } 
       return false; 
      }); 
      // take care of the sorting order 

      $scope.currentPage = 0; 
      // now group by pages 
      $scope.groupToPages(); 
     }; 

     $scope.groupToPages = function() { 
      $scope.pagedItems = []; 

      for (var i = 0; i < $scope.filteredItems.length; i++) { 
       if (i % $scope.itemsPerPage === 0) { 
        $scope.pagedItems[Math.floor(i/$scope.itemsPerPage)] = [ $scope.filteredItems[i] ]; 
       } else { 
        $scope.pagedItems[Math.floor(i/$scope.itemsPerPage)].push($scope.filteredItems[i]); 
       } 
      } 
      console.log($scope.pagedItems) 
     }; 

     $scope.range = function (size,start, end) { 
      var ret = [];   
      //console.log(size,start, end); 

      if (size < end) { 
       end = size; 
       start = size-$scope.gap; 
      } 
      for (var i = start; i < end; i++) { 
       ret.push(i); 
      }   
      // console.log(ret);   
      return ret; 
     }; 

     $scope.prevPage = function() { 
      if ($scope.currentPage > 0) { 
       $scope.currentPage--; 
      } 
     }; 

     $scope.nextPage = function() { 
      if ($scope.currentPage < $scope.pagedItems.length - 1) { 
       $scope.currentPage++; 
      }    
     }; 

     $scope.setPage = function() { 
      console.log($scope.pagedItems[$scope.currentPage]); 
      $scope.currentPage = this.n; 
     }; 

     $scope.search(); 

HTMLコード上記のよう

<tr ng-repeat="user in pagedItems[currentPage]" > 
     <td>{{user.name}} {{$index}}</td> 
     </tr> 

、5行としてそのテーブルの行の更新。しかし、次のページ番号をクリックすると10行を表示し、5行を非表示にします。私はあなたが人を理解して願っています！助けて。あなたは間違った考えている私の意見では

Answer 1

は、それがコントローラにあなたが必要になりました

$scope.showResults = function() { 
         $scope.list = $filter('startFrom')($scope.initialList, $scope.page * $scope.itemsPerPage); 
         $scope.list = $filter('limitTo')($scope.list, $scope.itemsPerPage); 
        } 
       }; 

を行うことができますカスタムフィルタを使用して、この

app.filter('startFrom', function() { 
     return function(input, start) { 
      start = +start; 
      return input.slice(start); 
     } 
    }); 

のようなあなたのビジネスロジックを分割する方が簡単です$ scope.pageを更新して$ scope.showResults（）を再利用してビューを更新するだけです

<tr ng-repeat="user in list" > 
    <td>{{user.name}} {{$index}}</td> 
    </tr> 

Answer 2

私はしませんあなたの問題はng-repeatによって引き起こされていると考えてください。私はちょうどあなたのコードを取って、いくつかのダミーデータを追加し、テストをして、それは完全に正常に動作します。

角度は2ウェイバインディングであるので、あなたはここにhttps://codepen.io/Cushdrive/pen/zvPPXd

それを確認することができますので、私はそれはいくつかのページング情報がどこかで引き起こされた可能性が不思議です。 currentPageitemPerPagesまたはpagedItemsのような変数をもう一度調べて、別の場所で使用されているかどうか確認できますか？