Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Error when toggling NgbDropdown if NgbDropdownToggle was inserted

See original GitHub issue

Bug description:

If an NgbDropdownToggle is added dynamically, with *ngIf for example, you get an error when you click the dropdown toggle: Cannot read property 'anchorEl' of undefined

This issue was mentioned in now closed issue #3297

An easy workaround, for my situation at least, was to move the conditional directive up to the enclosing NgbDropdown element.

Link to minimally-working StackBlitz that reproduces the issue:

https://stackblitz.com/edit/angular-sg77ok

Versions of Angular, ng-bootstrap and Bootstrap:

Angular: 8.1.1

ng-bootstrap: 5.0.0

Bootstrap: 4.3

Issue Analytics

State:
Created 4 years ago
Comments:7 (2 by maintainers)

Top GitHub Comments

2reactions

johanesneumanncommented, Sep 30, 2020

As far as I can see this is also happening when you don’t include ngbDropdownToggle directive at all. In my case I wanted to control the dropdown directly in the component (.ts file). I got the same error.

This also happened with me. Solved adding a <a ngbDropdownToggle style="display:none" /> to get rid of the error.

2reactions

saloumfallcommented, Oct 11, 2019

Change ngbDropdownItem by ngbDropdownAnchor !