Root menu not clickable

Forum rules
Please note that response time for technical support is within 3-5 business days.
Post Reply
dnx
Posts: 2
Joined: 08 Oct 2022, 13:10

12 Mar 2023, 23:17

Hi,

I would like to make my root menu clickable :

example :
  • Home => clickable (actually not by default in freya template)
  • Dashboard => clickable
  • Other => not clickable
    • Sub menu 1
    • Sub menu 2


Is there any way to achieve that, i used 'as-is' the menu system in the freya template

Thanks !

Kind Regards.

cetincakiroglu
Posts: 130
Joined: 17 Dec 2021, 09:33

16 Mar 2023, 10:14

Hi,

I'll check and get back to you

cetincakiroglu
Posts: 130
Joined: 17 Dec 2021, 09:33

16 Mar 2023, 10:25

Hi,

In app.menu.component, you'll see menu items as array and you can basically add it what you desire including callback to make root menu item actionable.

In app.menuitem.component, you'll see those menu items looped through to create menu elements. Inside the div with the class "layout-menuitem-root-text" there is an anchor element only visible if the menu item has a router link or child items. You can change it as you wish to display the anchor and make root menu item clickable. Or, you can use the callback I've mentioned above.

dnx
Posts: 2
Joined: 08 Oct 2022, 13:10

19 Mar 2023, 13:55

Thanks, indeed, i have to update the div root

<div *ngIf="root && item.visible !== false" class="layout-menuitem-root-text" [routerLink]="item.routerLink">{{ item.label }}</div>

still have to customize the look and feel (cursor hand, active state, etc..)

cetincakiroglu
Posts: 130
Joined: 17 Dec 2021, 09:33

20 Mar 2023, 08:38

Hi,

CSS of the menu is written for the default case which is the passive root item. You need to customize CSS too after making it clickable.

Post Reply

Return to “Freya - PrimeNG”

  • Information
  • Who is online

    Users browsing this forum: No registered users and 3 guests