我正在使用带有ng-bootstrap 的angular-cli@webpack版本（不是ng2-bootstrap）。我对我的 angular-cli 项目执行了以下操作：

然后将其添加到我的文件中：

然后我将它添加到 index.html：

太好了，一切正常。我的问题：

（第 1 部分）我真的必须在 index.html 中添加 bootstrap.min.css 吗？我可以不将 bootstrap.css 添加到 index.html 并仍然使用 ng-boostrap 吗？

（第 2 部分）如果不是，那么为什么 ng-bootstrap 不能在他们的设置中只包含 bootstrap.css 而我不需要将它添加到 index.html 中？

我尝试为 Angular 2 运行 ng-bootstrap，但我收到安装 ng-bootstrap 的错误。我相信这是一个路径问题。当我尝试访问页面并启动 npm 时，会发生此 404 错误。当 Angular ng-bootstrap 尝试加载时，我在导入模块上收到 404 错误：

但是这个模块在 node_modules 里面。谢谢

我已经按照 ng-bootstrap 网站上的安装说明使用 Angular2 的新 git 克隆，但是当 NgbModule 在@NgModule.

错误的屏幕截图：404 Error loading @ng-bootstrap

脚步：

1. 克隆 Angular2 的快速入门 git repo github.com/angular/quickstart

2. 编辑app.module.ts 如下：

   /li>

3. 确保bootstrap@4.0.0-alpha.3已安装 ng-bootstrap 和 angular2 RC5

4. 将 bootstrap .css 和 .js 脚本标签添加到index.html
5. npm start生成 Loading... 页面，仅此而已，可以在 Web 控制台中看到 404 错误

尝试通过 node_module 显式设置导入路径时也会发生同样的情况，例如。import { NgbModule } from "../node_modules/@ng-bootstrap/ng-bootstrap";

任何帮助表示赞赏。

更新1：

在项目根文件systemjs.config.js中添加了 @ng-bootstrap 行。浏览器控制台中出现类似的 404 错误。

systemjs.config.js：

更新 2

将 index.js 文件添加到systemjs.config.js中的包中，并在此处根据屏幕截图接收到各个文件的错误：

systemjs.config.js（摘录）

"HI", "title1", "objName11"虽然我的 HTML 加载（由于span顶部的标签而能够看到），但 ngb-accordion 不会在视图上呈现。我无法弄清楚我错过了什么。

没有编译/构建错误。控制台上没有错误。:(

我看到了一些关于 NGB-PRECOMPILE 的东西，这有必要吗？也无法在@ng-bootstrap/ng-bootstrap 中找到它。 https://stackoverflow.com/questions/38792108/precompile-error-on-ng-bootstrap-ngb-precompile

以下是代码片段， （我通过删除onInit我使用服务/可观察对象实际加载的实现来简化代码MyObject，只是为了重点）

我的模板：./someComponent.Component.html：

零件：

我的对象模型：

我开始学习 Angular2，我想在我的项目中使用 ng-bootstrap。但是，我无法制作一个工作项目。导入 ng-bootstrap 失败。由于我是初学者，我不知道问题是因为代码还是我犯的其他错误。

您能否为我提供一个使用 ng-bootstrap 和 Angular2 的工作且简单的项目，以便我可以尝试使其在我的计算机上运行？

编辑：

app.module.ts：

systemjs.config.js：

错误：

我正在使用 Angular2 和 ng-bootstrap。我从这里获取了 NgbAccordion 和 NgbTabset 示例。他们在功能上运作良好，但他们的风格是问题所在。单击时选项卡不会变为活动状态，并且手风琴中的面板完全没有样式。可能是什么问题呢？

首先我安装并导入了NgbModule：

• npm install --save @ng-bootstrap/ng-bootstrap
• import {NgbModule} from '@ng-bootstrap/ng-bootstrap'

此时，一切正常，我可以像以前一样运行我的应用程序ng-bootstrap

一旦我添加NgbModule到importsmy 的数组中NgModule，如下所述：

我无法运行npm startusing webpack-dev-server，因为它喊道：

这是我的webpack.config.js：

任何帮助和解释将不胜感激！

提前致谢！

更新：

source-map-loader从 中删除 的使用preLoaders会删除错误，但会导致浏览器中没有 Typescript 源。

知道该怎么做吗？为什么会这样？

我基本上从ng-bootstrap Modal Documentaion复制了 Modal 示例，似乎我无法打开它。

当我点击按钮打开 Modal 时，Chrome 的控制台会喊：

提前致谢！

编辑：

这是我的模态组件代码：

模态 HTML：

此 Modal 组件正在被另一个具有以下属性的组件使用<th>：

更新：

可能值得注意的是，在调试它时，我可以看到在调用open方法时会弹出错误this.modalService.open(content)

我正在尝试在 Modal 中使用最基本的折叠功能，但折叠不会触发

从字面上看，只是将这个 w3schools 折叠示例复制到我的模态中。

这是我的模态代码：

我的基本模态组件：

我的应用组件：

我的应用模块：

我尝试调试 DOM 中折叠的行为，好像当你折叠<div>它时它会添加一些类和一些属性，而当它折叠回来时它也会改变它们。

当我在 Modal 中调试它时，触发折叠按钮不会操纵 DOM，其类<div>及其属性保持不变。

有任何想法吗？

假设有这个模板（用于父组件）

在每个子组件（child-comp1 ...）中，我有一个表单和带有一些验证的输入。

如何按需从父组件访问子组件的方法，我的意思是这样的：

在父组件中，我有：

comp1并且comp2始终undefined在验证方法中！

tabs返回一个对象，但我找不到到达子组件的方法！