Angular之ng-bootstrap使用

Posted 2022-08-12 IT飞牛

如果需要使用ng-bootstrap，必须依赖以下两个东西：
1、Angular需要时5.0以上版本
2、需要引入Bootstrap CSS
注：不要在配置文件angular-cli.json中，引入bootstrap.js或bootstrap.min.js文件，这个可能会影响ng-bootstrap的运行。
ng-bootstrap官方说“Our code is automatically tested on all the supported browsers.”，意思做了全浏览器测试，目前还没有发现什么兼容问题。

安装：

npm install --save @ng-bootstrap/ng-bootstrap

安装完成后，需要先将模块引入到主模块和各个需要使用ng-bootstrap的模块中，主要区别是主模块上加上forRoot()，例如：

//----app.module.ts中代码
import NgbModule from '@ng-bootstrap/ng-bootstrap';
@NgModule(
  declarations: [AppComponent, ...],
  imports: [NgbModule.forRoot(), ...],
  bootstrap: [AppComponent]
)
export class AppModule 


//----other.module.ts中代码
import NgbModule from '@ng-bootstrap/ng-bootstrap';

@NgModule(
  declarations: [OtherComponent, ...],
  imports: [NgbModule, ...]
)
export class OtherModule 

翻译自： https://ng-bootstrap.github.io/#/getting-started