Прокрутите вверх, когда есть несколько записей в нумерации страниц - PullRequest
0 голосов
/ 25 июня 2019

Я использую ngb-нумерацию начальной загрузки в моем приложении angular 6, теперь ситуация такова, что когда у нас есть двенадцать записей, поступающих в API from, нумерация ngb показывает первые 10 записей, когда мы устанавливаем размер страницы равным 10, как показано ниже.все работает нормально, но когда пользователь нажимает на 2-й странице в пейджере, он перемещает страницу, где есть только две записи, но пользователь должен прокрутить вверх, чтобы увидеть эти записи.поэтому пользователь запрашивает автоматическую прокрутку вверх, когда имеется несколько записей, как указано в приведенном выше сценарии.

 <ngb-pagination [collectionSize]="pager.totalCount" [page]="pager.pageNumber" (pageChange)=" getMyOrders($event)"
                  [maxSize]="3" [ellipses]="false" [rotate]="true"></ngb-pagination>

1 Ответ

0 голосов
/ 25 июня 2019

Должен быть какой-то дизайн / CSS, который вызывает эту проблему, я пытался, но не смог воспроизвести проблему, о которой вы сообщили ...

релевантно HTML :

<div>
    <ul>
        <li *ngFor="let i of currentList"> {{ i }} </li>
    </ul>

    <ngb-pagination class="d-flex justify-content-center" [collectionSize]="numPages * 10" [(page)]="page" aria-label="Default pagination"
     (pageChange)="loadNext()"> </ngb-pagination>
</div>

релевантно TS :

export class AppComponent implements OnInit {
  name = 'Angular 6';
  page = 1;
  setSize = 10;

  someList = ['item1', 'item2', 'litem', 'item4', 'item5', 'item6', 'item7', 'item8', 'item9', 'item10',
    'item11', 'item12', 'item13'];

  numPages = this.someList.length / 10;
  currentList = this.someList.slice(0, 10);

  ngOnInit() {}

  loadNext = () => {
    const pointer = (this.page - 1) * this.setSize;
    const endPointer = pointer + 10;
    this.currentList = this.someList.slice(pointer, endPointer);
  }

}

работает здесь стек

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...