Как использовать `btn` с` pagination` в bootstrap

Question

Я пытаюсь создать нумерацию страниц с Bootstrap и Angular. Пока это выглядит так:

<ul class="pagination">
  <li class="page-item" *ngFor="let page of pages" [class.active]="page.isActive">
    <span class="page-link btn" (click)="pageChange(page.number)">{{page.text}}</span>
  </li>
</ul>

Но я не могу заставить кнопки вести себя как кнопки / якоря. Я хотел бы видеть курсор при наведении курсора. Как я могу это сделать?

Answer 1

Обратите внимание на следующее:

| `$enable-pointer-cursor-for-buttons` | `true` (default) or `false` | 
                               Add "hand" cursor to non-disabled button elements.|

И в _buttons.scss у нас есть:

.btn {
  ...
  cursor: if($enable-pointer-cursor-for-buttons, pointer, null);
  ...
}

Таким образом, изменение span на button заставляет его работать

<ul class="pagination">
  <li class="page-item" *ngFor="let page of pages" [class.active]="page.isActive">
    <button class="page-link btn" (click)="pageChange(page.number)">{{page.text}}</button>
  </li>
</ul>