2016-04-14 15 views
0

dir-pagination-controls'u birleştirmeye çalışıyorum, ancak sayfayı seçilen sayfaya göre görüntüleyemiyorum. Angularjs: Sayfa düğmesi basıldıktan sonra bile yönlendirme-denetimleri sonraki sayfayı göstermiyor

<div ng-controller="TableController as tc"> 
    <table> 
     <tbody dir-paginate="order in tc.orders | itemsPerPage: 10" total-items="tc.totalOrders" current-page="currentPage"> 
      <tr ng-click="tc.showOrderDetail(order.id)"> 
       <td ng-bind="order.id"></td> 
       <!-- Simliar lines are here --> 
      </tr> 
     </tbody> 
    </table> 
    <dir-pagination-controls 
     boundary-links="true" 
     on-page-change="tc.pageChangeHandler(newPageNumber)" 
     template-url="dirPagination.tpl.html"> 
    </dir-pagination-controls> 
</div> 

Bu table

ben beklediğiniz gösterir. Bununla birlikte, sonuçta ortaya çıkan sayfalandırma denetleyicisi, düğmelerinden birine bastığımda sonraki sayfayı göstermez.

İşte betiğin ilgili bir kısmı.

angular.module('adminAngular', ['ui.bootstrap','dialogs.main','angularUtils.directives.dirPagination']) 
.controller('TableController', function($http){ 

    var instance = this; 

    this.orders = []; 
    $http({ 
     //works fine 
    }).then(function (response) { 
     instance.orders = response.data; 
     instance.totalOrders = instance.orders.length; 
     //The "instance.orders" gets the expected data, and used for in dir-paginate="order in tc.orders 
    }); 

    this.pageChangeHandler = function(num) { 
     console.log('going to page ' + num); 
    }; 

    this.pageChanged = function(newPage) { 
     getResultsPage(newPage); 
    }; 

GÜNCELLEMEpageChangeHandler gösterileri hangi düğmesine basıldı ancak sayfa değişmez. (Her şey yolunda.)

Bu kod the official document and its demo numaralı telefonu esas almaktadır, ancak aslında yanlış olanı bulamıyorum.

Herhangi bir tavsiyede bulunursanız memnun olurum.

+1

hat üzerinde sayfalık değişim = "pageChangeHandler (newPageNumber)" konulu sayfalık değişim = "tc.pageChangeHandler (newPageNumber)" olması gerekmez mi? – Sarathy

+0

Haklısın! Bu yazıyı düzeltirim ... – Hiroki

+0

This.pageChanged() yöntemini herhangi bir yere mi çağırıyorsunuz? Sanırım pageChangedHandler() işlevinden çağırmanız gerekebilir. – Sarathy

cevap

4

Çözüm, total-items ürününü dir-paginate yönergesinden kaldırmaktır. İşte basit örnekle plunker.

total-items özniteliği, her sayfa öğelerini almak için arama yapıldığında çağrıları yaptığınızda kullanılır. Yani, ilk zaman uyumsuzluğu, ilk sayfa için öğeleri alırsınız ve sayfayı değiştirdiğinizde, ilgili sayfa için öğeleri sunucudan almanız gerekir. total-items, sayfa kaç tane sayfanızın sayfa numaralandırma yönergelerini anlattığından öğenin nasıl oluşturulacağını bilir.

Her sayfa için bir eşzamanlama çağrısı istiyorsanız, total-items kullanın ve başka bir eşzamanlama çağrısı yaptığınız pageChanged uygularsınız.

$scope.pageChanged = function(newPage) { 
    // get orders for newPage number 
    $http.get(...).then(function(response) { 
     // orders for newPage number fill the same 'orders' array 
     this.orders = response.data 
    }); 
} 
İlgili konular