Angular 4 left menu not expanding when clicking parent menu

See All Questions HereCategory: AngularJS version (1.8.x)Angular 4 left menu not expanding when clicking parent menu
exillum asked 3 months ago

I have a left menu, and I have an issue expanding collapsed menus that have children. I can expand one as soon as the app is refreshed, and I can go to all the children links under it. But, as soon as I try to click on any of the other parent menus on the left side…they will not expand. 
I can reach the page(s) using a direct link. The menus work fine if the menu is on top…
If I force (through Google developer tool) the <ul> style to be “display: block;”, I can see that the menu items are there. It is like the next parent menu I click on is not activated or something…
Anyone have any ideas…?

1 Answers
exillum answered 3 months ago

I figured out…after many hours…what the issue was. I created a drop-down with actions (edit, delete, etc) for each Data tables row. To make this work, I set the “rollback” part of options for the “datatable” component. It contains an unbind click, and then a bind click:

rowCallback: (row: Node, data: any[] | Object, index: number) => {
const self = this;

// Unbind first in order to avoid any duplicate handler
// (see
//var element = $('a', row);
$('a.row-action', row).unbind('click');
$('a.row-action', row).bind('click', (e) => {
self.actionClickHandler(e.currentTarget.className, data);
return row;

Originally, in the example I found on the Internet, it was like this:

$('a', row).unbind('click');
$('a', row).bind('click', (e) => {

Somehow the unbind  line..

$('a.row-action', row).unbind('click');

…messed of the menu on the left side. 
Just in case anyone else are doing something similar :-)
~ TJ

exillum replied 3 months ago

Sorry…the last "('a.row-action', row).unbind('click');" should have been "('a', row).unbind('click');". I ended up having to make sure I did the unbind and bind on the "a" only for my special class – "row-action".