Navigation Directive that handles keyboard events on its host and controls a targeted drop down base component

Constructors

Section titled "Constructors"

IgxDropDownItemNavigationDirective 

new IgxDropDownItemNavigationDirective(): IgxDropDownItemNavigationDirective

Returns IgxDropDownItemNavigationDirective

Properties

Section titled "Properties"
Section titled "dropdown" 
dropdown: IgxDropDownBaseDirective

Defined in projects/igniteui-angular/drop-down/src/drop-down/drop-down-navigation.directive.ts:15

Accessors

Section titled "Accessors"

activeDescendant

Section titled "activeDescendant" 
get activeDescendant(): string

Defined in projects/igniteui-angular/drop-down/src/drop-down/drop-down-navigation.directive.ts:57

Returns string

target

Section titled "target"

Gets the target of the navigation directive;

// Get
export class MyComponent {
 ...
 @ContentChild(IgxDropDownNavigationDirective)
 navDirective: IgxDropDownNavigationDirective = null
 ...
 const navTarget: IgxDropDownBaseDirective = navDirective.navTarget
}
get target(): IgxDropDownBaseDirective

Defined in projects/igniteui-angular/drop-down/src/drop-down/drop-down-navigation.directive.ts:34

Returns IgxDropDownBaseDirective

Sets the target of the navigation directive; If no valid target is passed, it falls back to the drop down context

<!-- Set -->
<input [igxDropDownItemNavigation]="dropdown" />
...
<igx-drop-down #dropdown>
...
</igx-drop-down>
set target(target: IgxDropDownBaseDirective): void

Defined in projects/igniteui-angular/drop-down/src/drop-down/drop-down-navigation.directive.ts:52

Parameters

Returns void

Methods

Section titled "Methods"

handleKeyDown

Section titled "handleKeyDown"

Captures keydown events and calls the appropriate handlers on the target component

 
handleKeyDown(event: KeyboardEvent): void

Defined in projects/igniteui-angular/drop-down/src/drop-down/drop-down-navigation.directive.ts:65

Parameters

  • event: KeyboardEvent

Returns void

onArrowDownKeyDown

Section titled "onArrowDownKeyDown"

Navigates to previous item

 
onArrowDownKeyDown(): void

Defined in projects/igniteui-angular/drop-down/src/drop-down/drop-down-navigation.directive.ts:120

Returns void

onArrowUpKeyDown

Section titled "onArrowUpKeyDown"

Navigates to previous item

 
onArrowUpKeyDown(): void

Defined in projects/igniteui-angular/drop-down/src/drop-down/drop-down-navigation.directive.ts:127

Returns void

onEndKeyDown

Section titled "onEndKeyDown"

Navigates to target's last item

 
onEndKeyDown(): void

Defined in projects/igniteui-angular/drop-down/src/drop-down/drop-down-navigation.directive.ts:134

Returns void

onHomeKeyDown

Section titled "onHomeKeyDown"

Navigates to target's first item

 
onHomeKeyDown(): void

Defined in projects/igniteui-angular/drop-down/src/drop-down/drop-down-navigation.directive.ts:141

Returns void