import {MatMenuModule} from '@angular/material/menu';
MatMenuSelector: mat-menu
Exported as: matMenu| Name | Description |
|---|---|
@Input()
| Class to be added to the backdrop element. |
@Input()
| Whether the menu has a backdrop. |
@Input()
| Whether the menu should overlap its trigger. |
@Input('class')
| This method takes classes set on the host mat-menu element and applies them on the menu template that displays in the overlay container. Otherwise, it's difficult to style the containing menu from outside the component. |
@Input()
| Position of the menu in the X axis. |
@Input()
| Position of the menu in the Y axis. |
@Output()
| Event emitted when the menu is closed. |
| Layout direction of the menu. |
| Parent menu of the current menu panel. |
@Input() Deprecated
| This method takes classes set on the host mat-menu element and applies them on the menu template that displays in the overlay container. Otherwise, it's difficult to style the containing menu from outside the component. |
@Output() Deprecated
| Event emitted when the menu is closed. |
Deprecated
| List of the items inside of a menu. |
| focusFirstItem | |
|---|---|
Focus the first item in the menu. | |
| Parameters | |
origin FocusOrigin = 'program' | Action from which the focus originated. Used to set the correct styling. |
| resetActiveItem | |
|---|---|
Resets the active item in the menu. This is used when the menu is opened, allowing the user to start from the first option when pressing the down arrow. |
| setElevation | |
|---|---|
Sets the menu panel elevation. | |
| Parameters | |
depth number | Number of parent menus that come before the menu. |
MatMenuItemThis directive is intended to be used inside an mat-menu tag. It exists mostly to set the role attribute.
Selector: [mat-menu-item]
Exported as: matMenuItem| Name | Description |
|---|---|
@Input()
| Whether ripples are disabled. |
@Input()
| Whether the component is disabled. |
| focus | |
|---|---|
Focuses the menu item. | |
| Parameters | |
origin FocusOrigin = 'program' | |
| getLabel | |
|---|---|
Gets the label to be used when determining whether the option should be focused. | |
| Returns | |
string | |
MatMenuTriggerThis directive is intended to be used in conjunction with an mat-menu tag. It is responsible for toggling the display of the provided menu instance.
Selector: [mat-menu-trigger-for] [matMenuTriggerFor]
Exported as: matMenuTrigger| Name | Description |
|---|---|
@Input('matMenuTriggerFor')
| References the menu instance that the trigger is associated with. |
@Input('matMenuTriggerData')
| Data to be passed along to any lazily-rendered content. |
@Output()
| Event emitted when the associated menu is closed. |
@Output()
| Event emitted when the associated menu is opened. |
| The text direction of the containing app. |
| Whether the menu is open. |
@Output() Deprecated
| Event emitted when the associated menu is closed. |
@Output() Deprecated
| Event emitted when the associated menu is opened. |
| closeMenu | |
|---|---|
Closes the menu. |
| focus | |
|---|---|
Focuses the menu trigger. | |
| Parameters | |
origin FocusOrigin = 'program' | Source of the menu trigger's focus. |
| openMenu | |
|---|---|
Opens the menu. |
| toggleMenu | |
|---|---|
Toggles the menu between the open and closed states. |
| triggersSubmenu | |
|---|---|
Whether the menu triggers a sub-menu or a top-level one. | |
| Returns | |
boolean | |
MatMenuContentMenu content that will be rendered lazily once the menu is opened.
Selector: ng-template[matMenuContent]
MatMenuDefaultOptionsDefault mat-menu options that can be overridden.
| Name | Description |
|---|---|
| Class to be applied to the menu's backdrop. |
| Whether the menu has a backdrop. |
| Whether the menu should overlap the menu trigger. |
| The x-axis position of the menu. |
| The y-axis position of the menu. |
MenuPositionXType: 'before' | 'after'
MenuPositionYType: 'above' | 'below'