ngx-datatable - Bootstrap主题未应用

Question

我正在尝试将Bootstrap主题应用于我的数据表。我正在使用ngx-datatable版本10.4.0，因为我仍在Angular 4上使用，并且11.0不兼容。根据更改日志，Bootstrap主题已在版本10.3.0中添加。

以下是我的component.html:

<div>
    <ngx-datatable class="bootstrap" [rows]="rows" [columns]="columns" (select)='onSelect($event)' [selected]="selected" [selectionType]="'single'"
        [limit]="10" [columnMode]="'force'" [headerHeight]="40" [footerHeight]="40" [rowHeight]="'auto'">
    </ngx-datatable>
</div>

但是，这不会像 demo中那样添加样式。我想我已经包含了 documentation显示的所有内容。

我正在使用Bootstrap 3.3.7。需要4.0吗？我没有正确包含一些东西吗？

Answer 1

确保您将scss file包括在您的构建中。

在.angular-cli.json中，您应该添加它:

"apps": [
  {
    ...
    "styles": [
      ...
      "../node_modules/@swimlane/ngx-datatable/release/themes/bootstrap.css",
      ...
    ],

<ngx-datatable>元素也应该同时具有 bootstrap和 ngx-datatable类:

<ngx-datatable class="bootstrap ngx-datatable">