Ngx-admin: Pagetop menus not working for new page

[AZm1n]

• I'm submitting a ...
  [ x ] bug report
  [ ] feature request
  [ ] question about the decisions made in the repository

• Do you want to request a feature or report a bug?
  Bug

• What is the current behavior?
  ba-Pagetop menus are not getting displayed on new pages.

• If the current behavior is a bug, please provide the steps to reproduce and if possible a minimal demo of the problem via
  https://plnkr.co or similar (you can use this template as a starting point: http://plnkr.co/edit/tpl:AvJOMERrnz94ekVua0u5).

• What is the expected behavior?
  ba-PageTop should display users, notification and message menu on new pages, please see details below.

• What is the motivation / use case for changing the behavior?

• Please tell us about your environment:

• Angular version: 2..2.3

• Browser: [all | Chrome XX | Firefox XX | IE XX | Safari XX | Mobile Chrome XX | Android X.X Web Browser | iOS XX Safari | iOS XX UIWebView | iOS XX WKWebView ]

• Other information (e.g. detailed explanation, stacktraces, related issues, suggestions how to fix, links for us to have context, eg. stackoverflow, gitter, etc)

Hello All,
I have created a new page based on the documentation and everything seems working fine except the menu on top.
for example when I navigate to my new page and I click on "Message" "Notification" or "User Area", the drop down menu class will not show up.
When I navigate to any of the pre existing page the Pagetop menu also stops working.

I have to reload the page to the dashboard view in order for the menus to reappear but again, once I navigate to the new page, the menu stops working again.

Interestingly i'm able to collapse the sidebar with no issues from the new page, only the user, notifications and messages are not displaying.
I can't seem to find any problem in the console window and there are no errors reported.

This happen on IE, Edge, Chrome and Opera.

I have tried multiple times, recreated the page, downloaded the repo from scratch but the behavior remain.

does anyone faced this issue or know how to trace it further?
Thanks a lot.

[AZm1n]

I have narrowed it down further to be caused by importing any module from the 'PrimeNG' Library,
for example adding the 'SplitButtonModule' will immediately trigger this behavior.

please note that I didn't require any PrimeNG CSS yet on my module, but certainly PrimeNG modules have CSS when importing their module.

did anyone successfully integrated PrimeNG with the project or know a quick workaround?
Thanks.

[martinkoo1]

I had exactly the same issue. Any of the primeng module load will somehow trigger bootstrap dropdown toggle twice (one from vendor and one from the chunk). It removing line entry 324 "Dropdown" from the webpack.common.js appears to be working ok.. (temporary fix). Hope someone can explain better why this is the case and what the correct fix for this is. Thanks

[arimus]

@martinkoo1 Thanks! Commenting out the loader for the bootstrap dropdown in webpack.common.js also resolved the issue for me. My guess is also that we're ending up with multiple bootstrap instances conflicting silently in some webpack chunks between primeng & ng2-bootstrap imports.

Collapse: "exports-loader?Collapse!bootstrap/js/dist/collapse",
// Dropdown: "exports-loader?Dropdown!bootstrap/js/dist/dropdown",
Modal: "exports-loader?Modal!bootstrap/js/dist/modal",

Interestingly enough, the bootstrap buttons on the bundled demo page are all unaffected. It was just in the baPageTop I was seeing the profile/settings/logout menu not appearing. Also note that with this "fix", the bootstrap button page continues to function properly at a glance.

[Bengejd]

I'm running into this issue now unfortunately... I cannot use PrimeNg's auto-complete feature because of the interference with Ng2 in some capacity. But I also cannot track down the correct line to comment out, now that Webpack.common.js isn't readily available in the current version.