'How to prevent PrimeNG TieredMenu from disappearing on click?
I have this menu:
And I want it to stay open when I click on the "Open" option. I have tried to capture the event in the corresponding command, but it didn't work:
import { Component, OnInit } from '@angular/core';
import { MenuItem } from 'primeng/api';
@Component({
selector: 'app-selection-menu',
template: ` <p-tieredMenu #menu [model]="items" [popup]="true"></p-tieredMenu>
<button
#btn
type="button"
pButton
icon="pi pi-fw pi-list"
label="Show"
(click)="menu.toggle($event)"
></button>`,
styles: [],
})
export class SelectionMenuComponent implements OnInit {
items: MenuItem[] = [];
constructor() {}
ngOnInit() {
this.items = [
{
label: 'File',
items: [
{
label: 'New',
icon: 'pi pi-fw pi-plus',
items: [{ label: 'Project' }, { label: 'Other' }],
},
{
label: 'Open',
command: (e) => { // <-- Here
console.log(e);
e.originalEvent.stopPropagation();
}
},
{ label: 'Quit' },
],
},
{
label: 'Edit',
icon: 'pi pi-fw pi-pencil',
items: [
{ label: 'Delete', icon: 'pi pi-fw pi-trash' },
{ label: 'Refresh', icon: 'pi pi-fw pi-refresh' },
],
},
];
}
}
How can I keep the menu open and control when to close it programmatically?
Sources
This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.
Source: Stack Overflow
| Solution | Source |
|---|

