Menu shows a short contextual set of commands in an overlay opened from a trigger button, icon button, row, toolbar control, or right-click area.
Use it for row actions, overflow more actions, user menus, context menus, toolbar actions, and nested command groups. Menu content is rendered in an overlay and can receive trigger data.
Do not use Menu for selecting form values; use Select, Autocomplete, ColorSwitcher, Datepicker, or another dedicated control. Do not use it for persistent navigation; use Navigation, Sidebar, Sidenav, or NavList. Do not use it for long lists, tables, filters, forms, modal workflows, command palettes, or bulk action bars.
Key Features:
Trigger-based and right-click context menus.
Nested submenus for grouped commands.
Icons, dividers, headings, headers, and footers.
Lazy rendering with trigger data.
The NgStarter Angular Menu component lets you show a short contextual set of commands in an overlay opened from a trigger or right-click area. Use ngs-menu for row actions, overflow more actions, user menus, context menus, toolbar actions, and nested command groups. It includes examples for Basic Menu, Menu With Icons, Menu Divider, and Menu Heading.
Keyboard access
A mouse click opens the menu without moving focus to a command. Tab or Shift+Tab focuses the trigger without opening the menu. Enter, Space, or Down opens a menu and focuses the first available command; Up opens it at the last command. Up and Down navigate commands, Home and End jump to the first and last command, and typing letters finds a command by its label. Enter or Space activates the command. Escape returns to the trigger. Tab closes the menus and continues the page's focus sequence.
Right opens a submenu and Left returns to its parent; these directions reverse in RTL layouts. A focusable context-menu trigger also supports Shift+F10 and the Context Menu key.
Basic Menu
Use a basic menu for a short set of commands opened from a button.
Menu With Icons
Use icons when menu commands benefit from quick visual scanning.
Menu Divider
Use dividers to separate related command groups inside the same menu.
Menu Heading
Use headings to label command groups when the menu contains more than one group.
Data Driven Menu
Generate menu items from command data when the same action model powers toolbar, row, or overflow menus.
No action selected
Menu Header & Footer
Use menu header and footer for compact context around the command list, such as account or status information.
Nested Menu
Use nested menus when one command opens a secondary command group.
Menu Positioning
Use positioning inputs when the overlay should open before, after, above, or below its trigger.
Context Menu
Use a context menu for right-click commands tied to a specific area or record.
Right click here to trigger a context menu
Lazy Rendering Menu
Use lazy menu content with trigger data when the same menu template must render commands for different records.
