angular - Ngx Bootstrap 元素不显示

Question

我已将 Ngx Bootstrap 添加到我的 Angular 项目中。之后，我创建了名为UI Elements.

ui-elements.module.ts

import { NgModule } from '@angular/core';
import { TooltipModule } from 'ngx-bootstrap/tooltip';
import { BsDatepickerModule } from 'ngx-bootstrap/datepicker';

@NgModule({
  imports: [
    BsDatepickerModule.forRoot(),
    TooltipModule.forRoot()
  ]
})
export class UiElementsModule { }

之后，我将上面的模块导入 mainapp module

app.module.ts

import { AppComponent } from './app.component';
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
import { LayoutsModule } from './layouts/layouts.module';

@NgModule({
  declarations: [
    AppComponent
  ],
  imports: [
    BrowserModule,
    AppRoutingModule,
    BrowserAnimationsModule,
    LayoutsModule,
    UiElementsModule
  ],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule { }

customer.component.html

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

但是 Ngx Bootstrap 仍然无法正常工作。没有错误。

有什么帮助吗？

标签： angularuser-interfacebootstrap-4frontendngx-bootstrap

Answer 1

你添加了引导 CSS 吗？

<!--- index.html -->
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.0/dist/css/bootstrap.min.css" rel="stylesheet" crossorigin="anonymous" integrity="sha384-KyZXEAg3QhqLMpG8r+8fhAXLRk2vvoC2f3B09zVXn8CA5QIVfZOJ3BCsw2P0p/We">

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