Приветствую! Заранее извиняюсь за "портянку", но привык излагать развёрнуто, чтобы лучше обрисовывать картину. Основные вопросы выделены.
Уточнения внизу.
Только начал изучать Angular.
Подскажите пожалуйста как правильно ("по фен-шую") реализовать постраничную выгрузку записей из БД в Angular? Google отдаёт статьи, где описана постраничная разбивка полного объёма данных, а мне нужно через подобие своего простенького API получать данные порциями, а страницы переключать с помощью компонента ngb-pagination.
У меня есть сервис, который получает/добавляет и удаляет записи БД. В конструкторе происходит получение данных (метод getItems) с передачей в API следующих данных: текущая страница (1), число записей на страницу (5), поле по которому сортировать (title) и направление сортировки (ASC). Выводит в принципе правильно, если не считать особенность сортировки записей с title'ом формата "Запись N", где N ∈ [1; ∞) (при ASC - 10 идёт сразу после 1, а не после 9, т.е. 1 - 10 - 2 - 3 - ... - 9. При DESC - 9 - 8 - 7 - ... - 2 - 1 - 10.
spoilerЭто не особо принципиально, но интересно было бы узнать как сделать натуральную сортировку прямо во время запроса из БД). Пробовал и через
->orderBy('LENGTH(title)', 'ASC')
->orderBy('title', 'ASC')
->get()
и через
->orderByRaw("CAST(title as UNSIGNED) ASC")
->get()
всё равно не удалось достичь нужного результата.
Но в пагинаторе только одна страница (что в принципе верно, т.к. API возвращает лишь часть данных).
Чтобы вывести все страницы мне (для того чтобы посчитать кол-во страниц) нужно дополнительно при получении данных получать ещё и общее количество записей? И как его выводить если для getItems возвращается JSON? Второй метод писать, который будет обращаться к другому адресу API, возвращающему общее количество записей? Какими-то костылями воняет или нет? Но я других вариантов пока не вижу.
После того как выведу все страницы в пагинаторе, как я понимаю, надо на клик по странице в пагинаторе повесить метод получения данных (getItems) с передачей ему номера нужной страницы? Или я нагородил слишком?
Плюсом к постраничной выгрузке ещё сортировка нужна, но по ней у меня такая мысль: при изменении параметров сортировки просто переключать на первую страницу с отсортированными по новому записями. Или есть варианты правильнее?
ДОПОЛНЕНИЕ:
В компоненте попытался догружать в массив items получаемые при переключении страницы записи. Но таблица, записи в которой выводятся через ngFor, просто очищается, при переключении на предыдущую страницу кратковременно отображается список записей для текущей.
В чём моя ошибка?
УТОЧНЕНИЯ:
На данный момент получилось реализовать получение записей для выбранной страницы. Но теперь при переключении страницы записи с не первой страницы в таблице не выводятся. Выводятся на миг в процессе переключения страницы на предыдущую. Не могу понять сам принцип вывода записей в ангуляре при получении их порциями, а не сразу всех. Добавлял их в массив items:
this.items = [ ...this.items, ...data['items'] ];, конечно же записи дублировались, но переключение страниц происходило нормально, с отображением нужных записей (ну и на последней отображались дубли)/
Переделал на foreach с проверкой на существование записи в массиве:
let app = this;
data['items'].forEach(function(item) {
if ( app.items.indexOf(item) === -1 ) {
app.items.push(item);
}
});
, но в таком случае записи опять выводились только на миг в момент переключения страницы. Уверен что костылю жутко, но опыта в ангуляре у меня вообще нет. Гугление подобных случаев (с получением данных порциями) не знает, только способы, где все данные уже получены. Нагуглил только то, что ангуляр не замечает изменений массива при добавлении записей и поэтому они не выводятся через ngFor.
Средний
Простой
Средний
Простой
