Блог

У меня приведенный ниже код работает нормально

  <ngb-pagination class="d-flex justify-content-end" [collectionSize]="100" [pageSize]="5"
  [(page)]="currentPage" [maxSize]="5" [rotate]="true" (pageChange)="getToPage(currentPage)" [boundaryLinks]="true"
  [ellipses]="true" size="lg"></ngb-pagination>
  

Как я прочитал по ссылке на официальную документацию — https://ng-bootstrap.github.io/#/components/pagination/api , говорят, что для ввода размера может быть установлено значение «lg» или «sm» в html.

Я хочу, чтобы он был отзывчивым, что означает, что для маленьких экранов размер должен принимать «sm», а для экранов среднего размера он должен принимать «lg». В ссылке нет информации о том, как динамически изменять размер. Выполнение с помощью CSS является альтернативным способом, но я хочу, чтобы это было сделано с помощью начальной загрузки.

Объявите переменную для текущего размера size: string = 'sm'; , поместите ее в шаблон [size]="size" и меняйте всякий раз, когда вам нужно.

https://stackblitz.com/edit/angular-l4cfzf?file=app/pagination-size.html

Редактировать Чтобы реагировать на изменение размера окна, вам необходимо настроить прослушиватель хоста

 @HostListener('window:resize', ['$event'])
onResize(event) {
    // check/set the size
}