ngx-datatable - 未应用引导主题

Question

我正在尝试将 Bootstrap 主题应用于我的数据表。我正在使用ngx-datatable10.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中那样添加样式。我想我已经包含了文档显示的所有内容。

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

Answer 1

确保将scss 文件包含在构建中。

在.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">