ng-bootstrap:在项目中使用scss

Question

我的angular项目正在使用scss，在我切换到ng-bootstrap之前，我遵循以下指导原则在我的angular项目中集成了bootstrap和scss：https://shermandigital.com/blog/bootstrap-sass-with-angular-cli/

现在我切换到ng-bootstrap。有没有类似的东西？

Answer 1

Net，在您编写的angular项目中

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

在主引导导入{NgbModule}中，从‘@ng- module.ts /ng-bootstrap’；

@NgModule({
  declarations: [AppComponent, ...],
  imports: [NgbModule.forRoot(), ...],
  bootstrap: [AppComponent]
})
export class AppModule {
}

或者在module.ts中

import {NgbModule} from '@ng-bootstrap/ng-bootstrap';

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

然后，你可以写一个组件，例如

<button type="button" class="btn btn-outline-secondary" placement="top" ngbTooltip="Tooltip on top">
  Tooltip on top
</button>

如果您已经以任何方式(*)导入了bootstrap.css.4.0，您可以看到正确的工具提示，否则您可以看到工具提示，但格式不正确。

(*)在angular-cli.json中导入css是非常值得的。

"styles": [
        "styles.css",
        "../bootstrap.css"
      ],