MatTabNavBar не показывает стрелки

Я заметил, что MatTabNavBar ведет себя иначе, чем обычная MatTabGroup, когда дело доходит до показа стрелок, если контейнер становится слишком маленьким для вкладок.

Я использовал официальную документацию для сборки MatTabNavBar и MatTabGroup, но вы можете видеть здесь, что MatTabGroup показывает стрелки, а MatTabNavBar - нет.

https://angular-gaio5u.stackblitz.io/

Шаблон, используемый для MatTabGroup:

<mat-tab-group>
  <mat-tab
    *ngFor="let tab of tabs"
    [label]="tab.label"
  >
    {{ tab.label }}
  </mat-tab>
</mat-tab-group>

Шаблон, используемый для MatTabNavBar:

<nav mat-tab-nav-bar>
  <a
    mat-tab-link
    *ngFor="let tab of tabs"
    [active]="isActive(tab)"
    (click)="setActive(tab)"
  >
    {{ tab.label }}
  </a>
</nav>

... так я что-то упустил?! Ожидаемый результат - MatTabNavBar, показывающий те же стрелки, что и MatTabGroup.

2 ответа

              <mat-tab-group class="mat-tab-header mat-tab-header-pagination-controls-enabled" mat-align-tabs="center" #tabs (selectedTabChange)="onTabPanelClick($event, $event.tab)">

Обратите внимание: это объявление -> class="mat-tab-header mat-tab-header-pagination-controls-enabled"

FYI, похоже, это исправлено в версиях @angular/material@8.2.x и новее.

Другие вопросы по тегам