Get 2024 Templates Mega Bundle!$1000 worth of 19 Bootstrap HTML, Vue & React Templates + 3 Vector Sets for just $99
Get for 99$

In Angular metronic latest version v8.2.3 User Profile Dropdown Menu (app-user-inner) and similar to this, all the others dropdowns with a click event does not working after first time


Reproduce criteria
-----------------------
Even still not fixed in the latest version as well [Angular metronic_v8.2.3]

Go to your preview URL
https://preview.keenthemes.com/metronic8/angular/demo1/dashboard

From left Side bar click on any of the Error Component and come back again on the dashboard the "User Profile dropdown on the right side top lift will stopped working".

Why you guys are unable to fix this issue I saw around 20+ threads almost everyone is facing the same issue since 1.5 years but still no luck.

Any idea about this issue when it will get fixed ?

Solutions i have tried
-----------------------
I have tried everything from the portal where you guys have suggested the solution but those all are not working for me.

MenuComponent.reinitialization();

reinitializeComponents();

Waiting badly for the Answer with a fix
----------------------------------------------
What's the deal here why these dropdowns are working with a hover option but not working with a click event, if we need to spend lot of time to debug and go through the code then what's the benefit we ae getting to use the Metronic paid version, its very frustrating since 1.5 years you guys are unable to made a fix for this issue.


Text formatting options
Submit
Here's a how to add some HTML formatting to your comment:
  • <pre></pre> for JS codes block
  • <pre lang="html"></pre> for HTML code block
  • <pre lang="scss"></pre> for SCSS code block
  • <pre lang="php"></pre> for PHP code block
  • <code></code> for single line of code
  • <strong></strong> to make things bold
  • <em></em> to emphasize
  • <ul><li></li></ul>  to make list
  • <ol><li></li></ol>  to make ordered list
  • <h3></h3> to make headings
  • <a></a> for links
  • <img> to paste in an image
  • <blockquote></blockquote> to quote somebody
  • happy  :)
  • shocked  :|
  • sad  :(

Replies (4)


Hi

In the file
/demo1/src/app/_metronic/layout/components/header/navbar/navbar.component.html

Can you try to add the default click with hover?

Replace from this:

data-kt-menu-trigger="{default: "click"}"


with below:

data-kt-menu-trigger="{default: "click", lg: "hover"}"


This will fix the user menu dropdown after back from error pages.

Full example:

<div class="app-navbar-item" [ngClass]="itemClass">
<div class="cursor-pointer symbol" [ngClass]="userAvatarClass" data-kt-menu-trigger="{default: "click", lg: "hover"}" data-kt-menu-attach="parent" data-kt-menu-placement="bottom-end">
<img src="./assets/media/avatars/300-3.jpg" />
</div>
<app-user-inner data-kt-menu="true"></app-user-inner>
</div>


Thank you



Hi,

Sorry for the delay in response. We understand your frustration with the dropdown menu issue in Angular Metroni. We apologize for any inconvenience this has caused. We will investigate this issue further to determine the root cause and work on a fix. Thank you for bringing it to our attention.



Yes please do the needful in this regard, its not frustrating only for me there are lot of other people who are facing the same issue and its making a very bad on the metronic users.
Once fixed please let me know, you have my email and i am badly waiting for this fix.

Thanks



Hello Faizal,

Did your team get a chance to fix this issue, i can reproduce the same issue in the latest angular Metronic with angular 17 as well.

https://preview.keenthemes.com/metronic8/angular/demo1/dashboard

Please update when exactly this issue will be fixed, 2 months has been passed already since i reported this issue, but still did not get any update on this.


Text formatting options
Submit
Here's a how to add some HTML formatting to your comment:
  • <pre></pre> for JS codes block
  • <pre lang="html"></pre> for HTML code block
  • <pre lang="scss"></pre> for SCSS code block
  • <pre lang="php"></pre> for PHP code block
  • <code></code> for single line of code
  • <strong></strong> to make things bold
  • <em></em> to emphasize
  • <ul><li></li></ul>  to make list
  • <ol><li></li></ol>  to make ordered list
  • <h3></h3> to make headings
  • <a></a> for links
  • <img> to paste in an image
  • <blockquote></blockquote> to quote somebody
  • happy  :)
  • shocked  :|
  • sad  :(
Text formatting options
Submit
Here's a how to add some HTML formatting to your comment:
  • <pre></pre> for JS codes block
  • <pre lang="html"></pre> for HTML code block
  • <pre lang="scss"></pre> for SCSS code block
  • <pre lang="php"></pre> for PHP code block
  • <code></code> for single line of code
  • <strong></strong> to make things bold
  • <em></em> to emphasize
  • <ul><li></li></ul>  to make list
  • <ol><li></li></ol>  to make ordered list
  • <h3></h3> to make headings
  • <a></a> for links
  • <img> to paste in an image
  • <blockquote></blockquote> to quote somebody
  • happy  :)
  • shocked  :|
  • sad  :(