尝试移植ng-bootstrap示例，但ngbDropdownToggle工作

Question

我是Angular和Bootstrap的新手，如果这个问题有些基本且有点广泛，请提前道歉。

出于测试/学习目的，我正在尝试从"Mixed menu items and form 'Toggle Dropdown'"移植到我的新项目https://ng-bootstrap.github.io/#/components/dropdown/examples Stackblitz示例，虽然我可以获取HTML渲染，但我无法通过下拉按钮切换。

我尝试了两种方法：

1. 我创建了一个项目，然后将相关的src / app文件从Stackblitz集合复制到项目的src / app文件夹中（即app.component.html，app.component.ts，app.module.ts，dropdown-form.html，dropdown-form.ts）。在这种方法下，HT​​ML呈现但下拉列表没有切换。
2. 作为第二次尝试，我尝试将整个Stackblitz集合复制到自己的文件夹中，并尝试在其上运行ng serve。在这种方法下，没有任何编译，并且有很多错误消息，从Could not find module "@angular-devkit/build-angular" . . .开始

我遇到的一个特殊问题是ngbDropdownToggle指令在哪里？

即来自dropdown-form.html：

<button class="btn btn-outline-primary" id="dropdownForm1" ngbDropdownToggle>Toggle dropdown</button>

在Stackblitz上，我注意到了"@ng-bootstrap/ng-bootstrap"的package.json中的依赖项，并想知道ngbDropdownToggle指令是否存在于那里，但当我尝试将该依赖项添加到我原始项目中的package.json文件时，编译器抱怨：Module not found: Error: Can't resolve '@ng-bootstrap/ng-bootstrap'。我的工作假设是我的原始项目缺少一些关键的ng-bootstrap导入/功能，但我不确定这是否正确，如果是这样，我如何添加必要的导入/功能？

非常感谢，如果有人有任何想法我可以如何移植Stackblitz文件并使下拉切换工作。 。 。

Answer 1

要使它在stackblitz上运行，你需要添加一个依赖项@ng-bootstrap/ng-bootstrap（查看下面的截图）

要让它在你的电脑上工作，你做npm install --save @ng-bootstrap/ng-bootstrap

此外，您需要在index.html中使用bootstrap css qazxsw poi

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" />