2017-04-07 2 views
0

まあ、私はngtableを生成しようとしているが、これは正しい改ページを生成していない、私は例を以下だが、ページネーションが問題である何、私のために動作しませんで改ページを生成します。ngTables

function usersMainCtrl($scope, NgTableParams, usersFactory) 
{ 
    var tableData = [] 

    //Table configuration 
    $scope.tableParams = new NgTableParams({ 
     page: 1, // show first page 
     count: 5 // count per page 
    },{ 
     //total:tableData.length, 
     filterDelay: 300, 
     //Returns the data for rendering 
     getData : function(params) { 
      return usersFactory.getUsers(params.url()).then(function(response) { 
       console.log(response); 
       console.log(params); 
       params.total(response.data.length); 
       return response.data; 

      }); 
     } 
    }); 
} 

enter image description here

答えて

0

私はngTableと初心者のビットを自分自身が、私は問題は、サーバー側からデータを取得しているという事実とは何かであると考えていると言って開始します。しかし、この例では明らかにされていない何 http://ng-table.com/#/intro/demo-real-world

は、改ページがあまりにもサーバーで処理されていること:私もこの作業を取得しようとしていた、とここngTables例を以下ました

(実際には、このサイトの例の大半は、リストにないインポートされたコードを使用しているため、実際には悪いです)。

NgTableParamsに返されたデータを明示的に設定してから、ngTableがページネーション自体を処理していたのです。ここで角度工場として設定し、残りのAPIからいくつかの在庫レコードを思い出させる私が持っているテーブルの一例である - これは単純化され、私のコントローラであるが、作業:

myApp.controller('stockListController', [ 
'$scope', '$timeout', '$q', '$http', 'stockList', 'NgTableParams', 
function ($scope, $timeout, $q, $http, stockList, NgTableParams) { 
    $scope.loading = true; 

    function initTable() { 
     stockList.getAll({ url: "localhost:52457"}) 
      .$promise.then(function (response) { 
       $scope.data = response; 
       $scope.tableParams = new NgTableParams({ 
        count: 2 // size of page 
       }, { 
        dataset: response 
       }); 
       $scope.loading = false; 
      }, function (response) { 
       alert('Rejected'); 
      }); 
    } 

    initTable(); 
} 

]);

これはあなたのシナリオでは役に立たないかもしれません(データの負荷がある場合は、読み込みが遅くなる可能性があると思いますが)。