• Overview
@angular/aria/tabs

A TabList container.

API

    
      class TabList implements OnInit ,OnDestroy {}

element

HTMLElement

A reference to the host element.

textDirection

any

Text direction.

orientation

any

Whether the tablist is vertically or horizontally oriented.

wrap

any

Whether focus should wrap when navigating.

softDisabled

any

Whether to allow disabled items to receive focus. When true, disabled items are focusable but not interactive. When false, disabled items are skipped during navigation.

focusMode

any

The focus strategy used by the tablist.

  • roving: Focus is moved to the active tab using tabindex.
  • activedescendant: Focus remains on the tablist container, and aria-activedescendant is used to indicate the active tab.

selectionMode

any

The selection strategy used by the tablist.

  • follow: The focused tab is automatically selected.
  • explicit: Tabs are selected explicitly by the user (e.g., via click or spacebar).

selectedTab

any

The current selected tab.

disabled

any

Whether the tablist is disabled.

ngOnInit

void
@returnsvoid

ngOnDestroy

void
@returnsvoid

open

boolean

Opens the tab panel with the specified value.

@paramvaluestring
@returnsboolean

Description

A TabList container.

The ngTabList directive controls a list of ngTab elements. It manages keyboard navigation, selection, and the overall orientation of the tabs. It should be placed within an ngTabs container.

<ul ngTabList [(selectedTab)]="mySelectedTab" orientation="horizontal" selectionMode="explicit">  <li ngTab value="first">First Tab</li>  <li ngTab value="second">Second Tab</li></ul>
Jump to details