Expected behavior

Clicking on an item or outside the dropdown makes it disappear.

Actual behavior

The dropdown disappears but its html remains clickable.When you click on an item the dropdown disappears but its html remains present. At the second click outside the dropdown it comes off well.

Resources (screenshots, code snippets etc.)

The menu code

<li
  class="nav-item dropdown mx-lg-1 no-outline"
  mdbDropdown
  routerLinkActive="active"
>
  <a
    class="nav-link rounded-circle waves-light dropdown-toggle"
    mdbDropdownToggle
    type="button"
    mdbWavesEffect
  >
    <mdb-icon fas icon="user-alt"></mdb-icon>
  </a>
  <div
    *dropdownMenu
    class="dropdown-menu dropdown dropdown-primary dropdown-menu-right"
    role="menu"
  >
    <a
      class="dropdown-item waves-light"
      mdbWavesEffect
      *ngFor="let item of profileItems"
      [routerLink]="item.route"
      routerLinkActive="active text-white"
      [routerLinkActiveOptions]="{ exact: true }"
    >
      {{ item.label }}
    </a>
    <div class="divider dropdown-divider"></div>
    <a class="dropdown-item waves-light" mdbWavesEffect href="#"
      >Logout</a
    >
  </div>
</li>

Click on the dropdown icon

Click on an item in the dropdown

Second click outside the dropdown

My version of MDBootstrap

ExampleClick on the item

Link always present (mouse pointer and link)

My chrome version

My Angular version

Sorry to the staff member I had deleted while trying to answer the previous message.