Как избежать сетевого запроса с undefined параметрами по умолчанию?

Question

[alexbog90]

Стоит задача - заставить работать angular material пагинатор с material grid list и material cards. По клику на кнопки пагинатора должен отправляться сетевой запрос на сервер с необходимыми параметрами.
Пример запроса: https://www.rijksmuseum.nl/api/en/collection?key=H...,
где p - количество страниц с датой, ps - кол-во данных на странице.

Во view следующий код:

<mat-paginator
  [length]='itemsLength'
  [pageIndex]='pageIndex'
  [pageSize]='pageSize'
  [pageSizeOptions]='pageSizeOptions'
  showFirstLastButtons
  (page)='pageEvent = getServerData($event)'>
</mat-paginator>

В .ts:

public getServerData(event?: PageEvent) {
    console.log('page Event: ', event);
    this.networkService.getQuery('Rembrandt', event?.pageIndex, event?.pageSize)
      .subscribe(response => {
        this.dataSource = response[this.artObjects];
        this.itemsLength = response[this.count];
        if (!!event) {
          this.pageIndex = event.pageIndex;
          this.pageSize = event.pageSize;
        }
      });
    return event;
  }

Проблема в том, что при первичной загрузке страницы (перед тем как я кликал кнопки пагинатора) event = undefined и соответственно запрос на сервер выглядит так:
https://www.rijksmuseum.nl/api/en/collection?key=H...
После клика на кнопку пагинатора идет правильный запрос на сервер и все последующие клики на пагинатор отрабатываются корректно. Как сделать так, чтобы первичный запрос на сервер шел со значениями по умолчанию?

Пробовал сделать так в начале метода, но так пагинатор ломается:

if (!event) {
      event.pageIndex = 0;
      event.pageSize = 10;
    }

Answer 1

[vadimMalovaniy]

const pageIndex = event?.pageIndex || 0;
const pageSize = event?.pageSize || 10;
this.networkService.getQuery('Rembrandt', pageIndex, pageSize)