impaginazione lato server aggiornabile

Question

Ciao Cerco di capire come rendere impaginazione lato server con angularjs ungable.

Ho due servizi web:

localhost:8080/app/api/period Metodo GET ritorno lista JSON delle entità. Come parametri vengono passati numero di pagina, intervallo di periodo di inizio e intervallo quando si ferma.

localhost:8080/app/api/period/count Metodo GET conteggio di ritorno dei periodi. Man mano che i parametri vengono passati, intervallo di periodo iniziale e intervallo quando si ferma.

this.tableParams = new ngTableParams({ 
     page: 1, 
     count: 10 
    }, { 
     counts: [10], 
     total: 0, 
     getData: function($defer, params) { 
      $http.get('/app/api/period', {params: { 
       pageNumber:params.page() - 1, 
       rangeStart:rangeStart, 
       rangeStop:rangeStop}}) 
       .success(function(data, status) { 

        params.total($http.get('/app/api/period/count', {params: { 
         rangeStart:rangeStart, 
         rangeStop:rangeStop}})); 

        $defer.resolve(data); 
       }); 
     } 
    }); 

Tabella params.total non è aggiornato corectly modo vengono visualizzati i dati in tabella, ma i pulsanti di impaginazione non sono visibili.

Qualcuno potrebbe spiegarmi come utilizzare $http.get all'interno dell'ascoltatore di successo di altri $http.get in questo caso per ottenere correttamente settato params.total.

Answer 1

Non si vedono i pulsanti di impaginazione perché il proprio get() probabilmente restituisce 10 per il conteggio a causa del limite "rangeStart", "rangeStop" sul lato server e se si restituiscono 10 risultati su 10 totali non c'è nulla da paginare .

È possibile restituire 10 risultati per richiesta, ma params.total deve sempre essere il conteggio di tutti i risultati.

In ogni caso non è necessario 2 get() chiama quando si può tornare in uno come questo: D

{ 
    "results": [ 
     { 
      "id": "1437", 
      "task_started_at": "2014-06-09 12:25:25", 
      "task_finished_at": "2014-06-09 12:25:25" 
     }, 
     { 
      "id": "1436", 
      "task_started_at": "2014-06-09 12:26:31", 
      "task_finished_at": "2014-06-09 12:26:31" 
     } 
    ], 
    "total": 1027 
} 

E si codice potrebbe essere la seguente:

params.total(data.total); 
$defer.resolve(data.results); 

E anche non hai bisogno di totale perché si otterrà da seerver quindi rimuovere:

total: 0; 

Finaly il codice con 2 get() chiama co ULD guardare qualcosa di simile:

this.tableParams = new ngTableParams({ 
     page: 1, 
     count: 10 
    }, { 
     getData: function($defer, params) { 
      $http.get('/app/api/period', {params: { 
       pageNumber:params.page() - 1, 
       rangeStart:rangeStart, 
       rangeStop:rangeStop}}) 
       .success(function(data, status) { 

        params.total($http.get('/app/api/period/count')); 

        $defer.resolve(data); 
       }); 
     } 
    }); 

dove numero $http.get('/app/api/period/count') rendimenti totale di record come 1234

Buona fortuna

Answer 2

Hai provato a utilizzare #ngTasty impaginazione lato server?

È molto più semplice.

http://zizzamia.com/ng-tasty/directive/table-server-side

Answer 3

guardare il rovescio della medaglia url, spero che questo può aiutare:

var Api = $resource('/data'); 
    this.tableParams = new NgTableParams({ 
     page: 1, // show first page 
     count: 10 // count per page 
    }, { 
     filterDelay: 300, 
     getData: function(params) { 
     // ajax request to api 
     return Api.get(params.url()).$promise.then(function(data) { 
      alert("1111"); 
      params.total(90); 
      return data.results; 
     }); 
     } 
    }); 
    }