如何在我的angular 4项目中安装ngx-bootstrap

发布时间：2020-12-17 17:47:29 所属栏目：安全来源：网络整理

导读：参见英文答案 How to add bootstrap to an angular-cli project????????????????????????????????????27个我可能无法将ngx-bootstrap安装到我的angular 4项目中,因此无法使用预定义的模板.我已经通过以下两个链接进行ngx-bootstrap安装,请指导我正确的方法.

参见英文答案 > How to add bootstrap to an angular-cli project????????????????????????????????????27个
我可能无法将ngx-bootstrap安装到我的angular 4项目中,因此无法使用预定义的模板.我已经通过以下两个链接进行ngx-bootstrap安装,请指导我正确的方法.

https://valor-software.com/ngx-bootstrap/#/getting-started

https://loiane.com/2017/08/how-to-add-bootstrap-to-an-angular-cli-project/

解决方法

ngx-bootstrap包含由Angular提供支持的所有核心(而不仅仅是)Bootstrap组件.因此,您不需要包含原始JS组件,但我们使用的是Bootstrap提供的标记和CSS.

安装说明

查看他们在Github上的官方Getting Started页面.

控制和文件是available here.

从npm安装ngx-bootstrap：

npm install ngx-bootstrap --save

向NgModule导入添加所需的包：

import { TooltipModule } from 'ngx-bootstrap/tooltip';

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

将组件添加到您的页面：

<button type="button" class="btn btn-primary"
        tooltip="Vivamus sagittis lacus vel augue laoreet rutrum faucibus.">
  Simple demo
</button>

您将需要引导程序样式：

Bootstrap 3

<!-- index.html -->
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet">

Bootstrap 4

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

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!