• Overview
@angular/aria/menu

An item in a Menu.

API

    
      class MenuItem<V> {  readonly element: HTMLElement;  readonly @Input() id: InputSignal<any>;  readonly @Input() value: InputSignal<V>;  readonly @Input() disabled: InputSignal<boolean>;  readonly @Input() @Output('searchTermChange') searchTerm: ModelSignal<string>;  readonly parent: Menu<V> | MenuBar<V> | null;  readonly @Input() submenu: InputSignal<Menu<V> | undefined>;  readonly active: Signal<boolean>;  readonly expanded: Signal<boolean | null>;  readonly hasPopup: Signal<boolean>;  open(): void;  close(): void;}

element

HTMLElement

A reference to the host element.

id

InputSignal<any>

The unique ID of the menu item.

value

InputSignal<V>

The value of the menu item.

disabled

InputSignal<boolean>

Whether the menu item is disabled.

searchTerm

ModelSignal<string>

The search term associated with the menu item.

parent

Menu<V> | MenuBar<V> | null

A reference to the parent menu or menubar.

active

Signal<boolean>

Whether the menu item is active.

expanded

Signal<boolean | null>

Whether the menu is expanded.

hasPopup

Signal<boolean>

Whether the menu item has a popup.

open

void

Opens the submenu focusing on the first menu item.

@returnsvoid

close

void

Closes the submenu.

@returnsvoid

Description

An item in a Menu.

ngMenuItem directives can be used in ngMenu and ngMenuBar to represent a choice or action a user can take. They can also act as triggers for sub-menus.

<div ngMenuItem (onSelect)="doAction()">Action Item</div><div ngMenuItem [submenu]="anotherMenu">Submenu Trigger</div>
Jump to details