/ / Jak osadzić numeryczne linki stronicowania w niestandardowym menu rozwijanym multi select - angularjs, angularjs-directive, paginacja

Jak osadzić numeryczne linki stronicowania w niestandardowym menu rozwijanym multi select - angularjs, angularjs-directive, paginacja

lubię wyznać, że nie jestem w tym dobrykątowe i wciąż uczące się. muszę ładować ogromne dane i wyświetlać je przez rozwijanie. Wolałbym, gdybym mógł zrobić paginację na końcu rozwijanym. Pracuję z niestandardowym menu rozwijanym, które jest dobre i zaczerpnięte z tej witryny http://developers.dss.ucdavis.edu/angularjs-serachable-multiselect-dropdown-directive/

ale powyższy niestandardowy wybór wielu rozwijanych brakówjedna funkcja do wyświetlania linku do stronicowania. więc problem polega na tym, że użytkownik nie może wyświetlić minimalnych danych i kliknąć na inne łącze na żądanie, aby załadować następny zestaw danych. po prostu zastanawiam się, czy ktoś nie chce dodać kodu do dyrektywy użytkownika, która dodaje funkcję paginacji.

więc mogę załadować 20 danych i kliknąć link następnej strony, aby załadować następne 20 danych. widziałem już ludzi, którzy opracowali już kanciaste dyrektywy dotyczące stronicowania. tutaj jest jeden podobny link http://angularjs4u.com/pagination/top-5-angularjs-pagination-demos-2014/ dlatego jestem nowy w kanciastym, więc nie rozumiem, jak dodać niestandardową dyrektywę paginacji do innej niestandardowej listy rozwijanej z wieloma zaznaczeniami.

Będzie to naprawdę dobra pomoc, jeśli ktoś mi pokaże, jak to osiągnąć. dzięki

Odpowiedzi:

1 dla odpowiedzi № 1

Z tym samym Bootstrapem UI, którego używają na tym blogu, istnieje dyrektywa paginacji.

Oto Plunkr

Oto kilka kluczowych punktów:

  1. Normalne powtórzenie ng jest ustawione jako zmienna filtrowana, aby umożliwić aktualizację filtru wyszukiwania wraz z paginacją.

    ng-repeat="item in filtered = (allItems | filter: ...
    
  2. W tym samym powtórzeniu po filtrze ustawiamy "limitTo", aby ustawić paginację na liście

    ... ) | limitTo:limit:begin
    

    Następnie wystarczy postępować zgodnie z ui bootstrap paginacja <uib-pagination total-items="filtered.length">