Tabs

API#

Property	Description	Type	Default	Global Config
`[nzSelectedIndex]`	Current tab's index	`number`	-
`[nzAnimated]`	Whether to change tabs with animation. Only works while `nzTabPosition="top" \| "bottom"`	`boolean \| {inkBar:boolean, tabPane:boolean}`	`true`, `false` when `type="card"`	✅
`[nzSize]`	preset tab bar size	`'large' \| 'small' \| 'default'`	`'default'`	✅
`[nzTabBarExtraContent]`	Extra content in tab bar	`TemplateRef<void>`	-
`[nzTabBarStyle]`	Tab bar style object	`object`	-
`[nzTabPosition]`	Position of tabs	`'top' \| 'right' \| 'bottom' \| 'left'`	`'top'`
`[nzType]`	Basic style of tabs	`'line' \| 'card'`	`'line'`	✅
`[nzTabBarGutter]`	The gap between tabs	`number`	-	✅
`[nzHideAll]`	Whether hide all tabs	`boolean`	`false`
`[nzShowPagination]`	Whether show pre or next button when exceed display area	`boolean`	`true`	✅
`[nzLinkRouter]`	Link with Angular router. It supports child mode and query param mode	`boolean`	`false`
`[nzLinkExact]`	Use exact routing matching	`boolean`	`true`
`(nzSelectedIndexChange)`	Current tab's index change callback	`EventEmitter<number>`	-
`(nzSelectChange)`	Current tab's change callback	`EventEmitter<{nzSelectedIndex: number,tab: NzTabComponent}>`	-
`(nzOnNextClick)`	Callback executed when next button is clicked	`EventEmitter<void>`	-
`(nzOnPrevClick)`	Callback executed when prev button is clicked	`EventEmitter<void>`	-

Property	Description	Type	Default
`[nzTitle]`	Show text in tab's head	`string \| TemplateRef<void>`	-
`[nzForceRender]`	Forced render of content in tabs, not lazy render after clicking on tabs	`boolean`	`false`
`[nzDisabled]`	tab disable	`boolean`	-
`(nzClick)`	title click callback	`EventEmitter<void>`	-
`(nzSelect)`	title select callback	`EventEmitter<void>`	-
`(nzDeselect)`	title deselect callback	`EventEmitter<void>`	-

Tab contents can be lazy loaded by declaring the body in a ng-template with the [nz-tab] attribute.

Show a link in tab's head. Used in router link mode.

This make the tabs component changes nzSelectedIndex with Angular route. You must use nz-tab-link instead of [nzTitle] in this situation.