在我的 Angular 2 应用程序中集成 bootstrap 4 popover 时出现错误答案

【问题标题】：I am getting error while integrating bootstrap 4 popover in my angular 2 application在我的 Angular 2 应用程序中集成 bootstrap 4 popover 时出现错误
【发布时间】：2017-03-22 06:02:12
【问题描述】：

我正在使用 Angular 2 RC 5 版本。在我的 Angular 2 应用程序中，我使用的是 system.config.js，因为我已经映射了 ng2-boostrap 包，如下所示

var map={
'ng2-bootstrap/ng2-bootstrap': 'node_modules/ng2-bootstrap/ng2-bootstrap',
}

在应用程序模块文件中，我正在像下面这样导入它

import {PopoverModule   } from 'ng2-bootstrap/ng2-bootstrap';

@NgModule({
  imports: [PopoverModule.forRoot()]
})

使用以上所有方法，我仍然在浏览器的控制台中收到如下错误

错误：（SystemJS）无法读取未定义的属性“forRoot” TypeError：无法读取未定义的属性“forRoot” 在评估 (http://localhost:3000/assets/app.module.js:259:149) 执行时 (http://localhost:3000/assets/app.module.js:270:14) 加载时出错http://localhost:3000/assets/main.js

我指的是这个链接https://valor-software.com/ng2-bootstrap/index-bs4.html#/popover

【问题讨论】：

标签： angular ng2-bootstrap

【解决方案1】：

不确定您所指的图书馆，但这里有一些观察：

您使用的是非常旧的 Angular 版本 - 您应该更新到最新的 2.x 或立即考虑 4.x
如果您愿意探索不同的方法，这里有一个优秀的库，其中包含所有 Bootstrap 组件，包括弹出框：https://ng-bootstrap.github.io/#/components/popover

众所周知，提到的库可以与 Angular 2.x 和 4.x 一起使用，并且使用起来非常简单：

<button type="button" class="btn btn-secondary" placement="top"
        ngbPopover="Vivamus sagittis lacus vel augue laoreet rutrum faucibus." popoverTitle="Popover on top">
  Popover on top
</button>

您可以在这个最小的 plunk 中看到它的实际效果（它应该可以帮助您在项目中配置 SystemJS 和其他文件）：http://plnkr.co/edit/pTZpUjpmAe2Pc1jxO2u0?p=preview

【讨论】：

我指的是“ng2-bootstrap”：“1.0.24”