PrimeTek
p-menu property for binding selected/focused item #2767
-
|
I'm trying to use p-menu as nav. Just found out I cannot pre-select a menu item. I know i can do a workaround by adding p-focus class but I don't think that's a nice way to do it. |
Beta Was this translation helpful? Give feedback.
Replies: 1 comment
-
|
Hi @NanobyteRuata. If you want to use p-menu for navigation, and indicate the currently active route, the best way is to take advantage of the built-in router support: https://primeng.org/menu#router Here is a tiny demo what to do: https://stackblitz.com/edit/nqyfot-q76ukv?file=src%2Fapp%2Fmenu-router-demo.ts |
Beta Was this translation helpful? Give feedback.
Hi @NanobyteRuata. If you want to use p-menu for navigation, and indicate the currently active route, the best way is to take advantage of the built-in router support: https://primeng.org/menu#router
Here is a tiny demo what to do: https://stackblitz.com/edit/nqyfot-q76ukv?file=src%2Fapp%2Fmenu-router-demo.ts
You can style with the
.p-menuitem-link-activeclass that is being added by the RouterLinkActive directive.We also have
routerLinkActiveOptionsto configure how to determine if the router link is active. https://angular.dev/api/router/IsActiveMatchOptions