piątek, 24 lutego 2017

Paginator

Wreszcie zrobiłem paginację w Angularze. A nie było łatwo. Stworzyłem komponent "Paginator", z którego mogłyby korzystać wszystkie moduły aplikacji. Wystarczyło w nich załadować ów komponent metodą wstrzyknięcia zależności (fachowo nazywa się to "Dependency Injection"). No i działało, nie było z tym problemu. Do zainicjowania komponent potrzebował pewnych informacji - liczebności tabeli, z której pobierał wiersze, stałej wartości ilości wierszy na stronę, stałej ilości maksymalnej ilości przycisków z numeracją (po przekroczeniu której pojawia się wielokropek w środku paginatora). Tych wszystkich inicjalizacyjnych danych dostarczał serwis komponentu. Lista się wyświetlała, pod nią paginator i wszystko działało jak należy.

Ale szybko zauważyłem, że liczba wierszy na stronę nie może być jednakowa dla wszystkich modułów. Należało uzależnić ją od modułu. Wobec tego do ustawień aplikacji dołożyłem klucz w postaci obiektu JSON, w którym podaję, ile linii ma przypadać na który moduł. Inicjalizator paginatora odczytywał klucz, odnajdywał wartość dla aktualnie uruchamianego modułu i gotowe. Prosto i elegancko.

Prawdziwy jednak problem pojawił się, gdy uświadomiłem sobie, że nie wystarczy odpowiednio zainicjować paginator na początku. Podczas działania modułu trzeba jeszcze nim dynamicznie zarządzać! No bo przecież wyświetlane listy też są dynamiczne - może na nich przybywać pozycji, gdy tworzymy nowe elementy, np. strony, obrazki galerii. Może też ubywać, gdy kasujemy. Paginator musi za każdym razem uwzględniać zmieniającą się liczebność list! Ktoś powie: co za problem? Dopisać do komponentu metodę, która aktualizuje paginator. Tak, to oczywiste. Ale trzeba jeszcze zaktualizować tzw. $scope paginatora, który jest powiązany z wyświetlanymi pod listą kontrolkami. A to już nie takie proste. Ale znalazłem rozwiązanie - genialna metoda $watch, którą dostarcza framework. No i problem rozwiązany! Pozostaje tylko cieszyć się nową kontrolką.

Brak komentarzy:

Prześlij komentarz