angular - 带有 Angular 2 的 NGX-Datatable - 包装列的名称

Question

我有一个带有 Angular 2 的 ngx-datatable，它有一些很长的列名。
我想复制他们对行( Link to Documentation )的自动高度所做的事情，但会满足于将非常长的名称包装成多行。

通常这不会成为问题，但是由于我对 Angular 的陌生，我被卡住了。像溢出换行或自动换行这样的正常事情似乎不起作用。任何帮助和/或建议将不胜感激。谢谢!

我目前的代码:

  <div class="full-width">
    <ngx-datatable
      class='material'
      [rows]='rows'
      [columns]="columns"
      [columnMode]="'standard'"
      [headerHeight]="150"
      [footerHeight]="50"
      [scrollbarH]="true"
      [rowHeight]="'auto'"
      >
    </ngx-datatable>
  </div>

Answer 1

将此添加到 CSS 中就可以解决问题。它还使列标题居中并垂直对齐。

.ngx-datatable.fixed-header .datatable-header .datatable-header-inner .datatable-header-cell {
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: normal !important;
  text-align: center !important;
  vertical-align: middle !important;
}