Bottom Navigation component enables the user to navigate among a number of contents displayed in a single view.
Igx Module
IgxBottomNavModule
Igx Theme
igx-bottom-nav-theme
Igx Keywords
bottom navigation
Igx Group
Layouts

Remarks

[object Object]

Example

<igx-bottom-nav>
    <igx-bottom-nav-item>
        <igx-bottom-nav-header>
            <igx-icon igxBottomNavHeaderIcon>folder</igx-icon>
            <span igxBottomNavHeaderLabel>Tab 1</span>
        </igx-bottom-nav-header>
        <igx-bottom-nav-content>
            Content 1
        </igx-bottom-nav-content>
    </igx-bottom-nav-item>
    ...
</igx-bottom-nav>

Constructors

Section titled "Constructors"

IgxBottomNavComponent 

new IgxBottomNavComponent(): IgxBottomNavComponent

Returns IgxBottomNavComponent

Properties

Section titled "Properties"

items

Section titled "items"

Inherited from: IgxTabsDirective

Returns the items.

 
items: QueryList<IgxTabItemDirective>

Defined in projects/igniteui-angular/tabs/src/tabs/tabs.directive.ts:90

selectedIndexChange

Section titled "selectedIndexChange"

Inherited from: IgxTabsDirective

Output to enable support for two-way binding on [(selectedIndex)]

 
selectedIndexChange: EventEmitter<number>

Defined in projects/igniteui-angular/tabs/src/tabs/tabs.directive.ts:72

selectedIndexChanging

Section titled "selectedIndexChanging"

Inherited from: IgxTabsDirective

Emitted when the selected index is about to change.

 
selectedIndexChanging: EventEmitter<ITabsSelectedIndexChangingEventArgs>

Defined in projects/igniteui-angular/tabs/src/tabs/tabs.directive.ts:78

selectedItemChange

Section titled "selectedItemChange"

Inherited from: IgxTabsDirective

Emitted when the selected item is changed.

 
selectedItemChange: EventEmitter<ITabsSelectedItemChangeEventArgs>

Defined in projects/igniteui-angular/tabs/src/tabs/tabs.directive.ts:84

Accessors

Section titled "Accessors"

selectedIndex

Section titled "selectedIndex"

Inherited from: IgxTabsDirective

Gets/Sets the index of the selected item. Default value is 0 if contents are defined otherwise defaults to -1.

 
get selectedIndex(): number

Defined in projects/igniteui-angular/tabs/src/tabs/tabs.directive.ts:36

Returns number 

set selectedIndex(value: number): void

Defined in projects/igniteui-angular/tabs/src/tabs/tabs.directive.ts:40

Parameters

  • value: number

Returns void

selectedItem

Section titled "selectedItem"

Inherited from: IgxTabsDirective

Gets the selected item.

 
get selectedItem(): IgxTabItemDirective

Defined in projects/igniteui-angular/tabs/src/tabs/tabs.directive.ts:95

Returns IgxTabItemDirective