Угловой бустрап: ngbDropdown / ngbDropdownToggle и доступ? - PullRequest
0 голосов
/ 01 апреля 2019

Мы используем меню Bootstrap 4 для навигации по сайту. Мы хотели бы иметь возможность дополнительно использовать выпадающие списки ng-bootstrap.

Вы можете превратить DS в NGB с помощью их директивы:

<li class="nav-item" ngbDropdown>
  <a class="nav-link" ngbDropdownToggle role="button" aria-haspopup="true" aria-expanded="false">Menu 2</a>
  <div class="dropdown-menu ngbfade" aria-labelledby="navbarDropdownMenuLink" ngbDropdownMenu>
    <a class="dropdown-item" routerLink="">Menu Item 1</a>
    <a class="dropdown-item" routerLink="">Menu Item 2</a>
    <a class="dropdown-item" routerLink="">Menu Item 3</a>
  </div>
</li>

Однако с этой настройкой пользователи не могут ни вкладывать в меню, ни открывать его, ни вкладывать / стрелку в опции, как они могут в обычном меню Bootstrap.

Код на сайте ng-bootstrap выдает совершенно другой HTML, который больше напоминает раскрывающееся меню, чем меню ссылок:

<div ngbDropdown class="d-inline-block">
  <button class="btn btn-outline-primary" id="dropdownBasic1" ngbDropdownToggle>Toggle dropdown</button>
  <div ngbDropdownMenu aria-labelledby="dropdownBasic1">
    <button ngbDropdownItem>Action - 1</button>
    <button ngbDropdownItem>Another Action</button>
    <button ngbDropdownItem>Something else is here</button>
  </div>
</div>

Есть ли способ заставить версию директивы реагировать на табуляции?

Я попытался добавить href, но, конечно, с Angular, который делает щелчок, вы попадете на домашнюю страницу приложения.

...