Нет поставщика для NgbDropdown с Angular Bootstrap

Question

Я пытаюсь использовать NbgDropdown в приложении и получаю следующую ошибку:

NullInjectorError: Нет поставщика для NgbDropdown!

Мой файл app.module выглядит следующим образом:

import { NgbModule } from '@ng-bootstrap/ng-bootstrap';
...

NgModule({
    declarations: [
        ...
    ],
    imports: [
        ...
        NgbModule.forRoot()
    ],
    providers: [
        ...
    ],
    bootstrap: [AppComponent]
})

Из других ответов это выглядит так, как и должно быть

Я видел следующий краткий комментарий, который может помочь, но он не имеет смысла для меня:

https://stackoverflow.com/a/46636887/2178363

Answer 1

Убедитесь, что ваша HTML-разметка имеет атрибут ngbDropdown для ngbDropdownToggle и ngbDropdownMenu parent.

<div ngbDropdown> <!-- **here** -->
  <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>

Answer 2

Как сообщает @robert, на официальном примере проблема заключается в том, что html выпадающего меню не должен находиться непосредственно в app.component.html.Если поместить его там, появляется заявленная ошибка.

Я не уверен, что размещение html выпадающего меню в его собственном компоненте - единственное решение, но это разница между работой и неработоспособностью для моей ситуации.Я не смог поместить содержимое, найденное в dropdown-basic.html, в app.component.html, не столкнувшись с проблемой.

Я бы посоветовал авторам угловой начальной загрузки поместить требуемое использование непосредственно вдокументация.Как сейчас, это не явно.Официальный пример просто выглядит как один из способов использования кода.