NG-showがNGリピート

Question

以下

で作業していない私のテーブルマークアップは、それ

<ul class="pagination"> 
      <li class="page-item" ng-repeat="x in getNumber(rowPerPage) track by $index"> 
       <a class="page-link" ng-click="pagerIndex=$index+1">{{$index+1}}</a> 
      </li> 
     </ul> 

そしてAngularJsコード

$scope.ProductInfo_Pager = $scope.ProductInfo; 

     $scope.sortType = 'Product'; // set the default sort type 
     $scope.sortReverse = false; // set the default sort order 
     $scope.searchText = ''; // set the default search/filter term , 


     $scope.totalItems = $scope.ProductInfo.length; 
     $scope.currentPage = 1; 
     $scope.rowPerPage = 5; 
     $scope.pagerIndex = 1; 

     $scope.getNumber = function (num) { 

      var pages = $window.Math.ceil($scope.totalItems/num); 
      return new Array(pages); 
     } 

     $scope.paginate = function (rowindex) { 
      var begin, end, index, flag ; 
      index = $scope.pagerIndex; 
      end = (index * $scope.rowPerPage) - 1; // -1 to sync it with zero based index 
      begin = end - $scope.rowPerPage + 1; 
      if(rowindex >=begin && rowindex <= end){ 
       flag=true; 
      } 
      else{ 
       flag=false; 
      } 
      var d = 0; 
      return flag; 
     }; 

のpaginate関数（）以下

<tr ng-show="paginate({{$index+1}})" ng-repeat="x in ProductInfo_Pager | orderBy :sortType:sortReverse | filter:searchText | limitTo : rowPerPage" ng-class="$even?'table-danger':'table-info'"> 
        <td>{{$index+1}}</td> 
        <td>{{x.Product}}</td> 
        <td>{{x.Location}}</td> 
        <td>{{x.Qty}}</td> 
        <td>{{x.UnitPrice | currency : '&#x20B9;':2}}</td> 
        <td class="text-center"> 
         <i class="fa fa-flag" aria-hidden="true" style="color:red" />&nbsp;&nbsp;|&nbsp;&nbsp; 
         <i class="fa fa-bolt" aria-hidden="true" style="color:red" />&nbsp;&nbsp;|&nbsp;&nbsp; 
         <i class="fa fa-users" aria-hidden="true"></i> 
        </td> 
       </tr> 

とページャですng-repeatのtrタグでng-showで使用されているロジックに基づいて真または偽を返しますが、それはしません

ロジックの予想通り、ショーを隠すINGの機能は次のとおりです。 と仮定rowPerPageが5である -

[5行が一度にテーブルに表示することができ]そして、それはから行を表示する必要がありますので、私たちは、ページャに4をクリックしてください16-20。

ng-show paginate関数は行インデックスをパラメータとして取ります。この関数はrowindexが16〜20の範囲内にあるかどうかをチェックし、そうであればtrue（ng-show=true）else falseを返し、その行を非表示にします。これは

が起こっているなぜNG-ショーに変更が完璧に動作するはずですが、それは何の効果 は表示されません結合その2つの方法を理解ムーあたりとして

は、誰かが私を助けることができる私はangularjs

で初心者です

ありがとうございます。

Answer 1

ng-showはここでは動作しません。ng-showで書かれた関数は全く呼び出されません！

私が正しくあなたが改ページを作成したい理解していれば：

だから私は、ページネーションフィルタを使用してあなたのページネーションの非常にシンプルなソリューションを与えています。アプリにこのフィルタを追加する必要が

：

app.filter('pagination', function() { 
return function(input, start) { 
    start = +start; //parse to int 
    if (input != undefined && Object.keys(input).length > 0) { 
     return input.slice(start); 
    } 

} 

}）;あなたのHTML内

：あなたのテーブルの下のあなたのページネーションのULで

<tr ng-repeat="x in ProductInfo_Pager | pagination: currentPage * rowPerPage | limitTo: rowPerPage|orderBy :sortType:sortReverse | filter:searchText" ng-class="$even?'table-danger':'table-info'"> 
       <td>{{$index+1}}</td> 
       <td>{{x.Product}}</td> 
       <td>{{x.Location}}</td> 
       <td>{{x.Qty}}</td> 
       <td>{{x.UnitPrice | currency : '&#x20B9;':2}}</td> 
       <td class="text-center"> 
        <i class="fa fa-flag" aria-hidden="true" style="color:red" />&nbsp;&nbsp;|&nbsp;&nbsp; 
        <i class="fa fa-bolt" aria-hidden="true" style="color:red" />&nbsp;&nbsp;|&nbsp;&nbsp; 
        <i class="fa fa-users" aria-hidden="true"></i> 
       </td> 
      </tr> 

：あなたのコントローラで

<ul class="pagination"> 
<li class="page-item" ng-repeat="x in getNumber(rowPerPage) track by 
$index"> 
    <a class="page-link" ng-click="pagerIndex=$index+1">{{$index+1}} 
</a> 
</li> 
</ul> 

：

$scope.numberOfPages = function() { 
      if ($scope.ProductInfo_Pager != undefined) { 
       return Math.ceil($scope.ProductInfo_Pager.length/
        $scope.rowPerPage); 
      } 

     }; 

はそれがうまく願っています！ご不明な点がございましたらお知らせください。