Как создать пользовательскую нумерацию страниц в угловых 2+? - PullRequest
Новая
       80

Как создать пользовательскую нумерацию страниц в угловых 2+?

0 голосов
/ 26 сентября 2018 
<nav aria-label="Page navigation example">
  <ul class="pagination">
    <li class="page-item"><a class="page-link" href="#">Previous</a></li>
    <li class="page-item"><a class="page-link" href="#">1</a></li>
    <li class="page-item"><a class="page-link" href="#">2</a></li>
    <li class="page-item"><a class="page-link" href="#">3</a></li>
    <li class="page-item"><a class="page-link" href="#">Next</a></li>
  </ul>
</nav>

Я новичок в угловой, пожалуйста, помогите ...

Я хочу использовать указанный выше код нумерации страниц в моем пользовательском компоненте нумерации страниц, а также когда я использую компонент нумерации страниц в другом html-компоненте как

(app-paginate [somedata] = "somevalue" и событие> _______ (/ app-paginate>

Это должно работать ...

ПРИМЕЧАНИЕ:Я уже использовал нумерацию страниц ngx-bootstrap, поэтому, пожалуйста, не предоставляйте этот ответ, я хочу сделать свой собственный компонент нумерации страниц.

извините за мой плохой английский ..

СПАСИБО

1 Ответ

0 голосов
/ 26 сентября 2018

Если вы знаете о ngx-bootstrap и вам нравится их компонент, но вы хотите по-другому взглянуть, вы можете проверить их реализацию компонента нумерации страниц на github, а затем адаптироваться к вашему случаю.

Вот пример пользовательской версии предыдущей кнопки с примерно таким же машинописным кодом: 

<li *ngIf="directionLinks" class="page-item" [class.disabled]="!hasPrevious() || disabled">
    <a aria-label="Previous" i18n-aria-label="@@pagination.previous-aria"class="page-link" href (click)="!!selectPage(page-1)"
      [attr.tabindex]="(hasPrevious() ? null : '-1')">
      <myCustomIcon aria-hidden="true"></myCustomIcon >
      <span class="sr-only" i18n="@@pagination.previous"></span>
    </a>
  </li>
...