I have created a simple array of MenuItem objects to populate the Tabmenu component from Primeng. Here is an example:
.ts file:
items = MenuItem[];
activeItem = MenuItem;
//constructor, etc...
ngOnInit() {
this.items = [
{label: 'Homework', icon: 'fa-file-pdf-o'},
{label: 'Movies', icon: 'fa-file-pdf-o'},
{label: 'Games', icon: 'fa-file-pdf-o'},
{label: 'Pictures', icon: 'fa-file-pdf-o'}
];
this.activeItem = this.items[2]
}
.html file:
<p-tabMenu [model]="items" [activeItem]="activeItem"></p-tabMenu>
To set the active item of the tabmenu, you can use the activeItem property like this:
this.activeItem = this.items[2]
Now, my question is whether it's possible to retrieve the activeItem on click. For example:
<p-tabMenu [model]="items" [activeItem]="activeItem" (click)="getActiveItem(...)"></p-tabMenu>
Method for getting Active Item:
getActiveItem(activeItem: MenuItem){
this.activeItem = activeItem;
console.log(activeItem);
return this.activeItem;
}
P.S. Here is a link to the TabMenu component from Primeng: CLICK