Getting Started
Overview
Installation
Theme
Forms
Basic Inputs
Custom Inputs
Select
Components
Components
78
Micro Charts
Navigation
Libraries
Content Editor
Data View
Form Builder
Headless Editor
Image Designer
Kanban Board
PDF Builder
PDF Signer
PDF Viewer
Video Player
GitHub repositoryGitHub starsGitHub forksNgStarter UI npm versionNgStarter UI npm downloads per month

Menu

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.

Lazy Rendering Menu

Use lazy menu content with trigger data when the same menu template must render commands for different records.