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;
}

Answer 2

此外，您可以在ng-template或ngx-datatable-column标签处尝试以下代码：

[headerClass] =“'英国文字中心'” cellClass =“ uk-text-center”

我使用了UI KIT库，但是您可以在.scss文件中简单地创建类，由您自己决定，希望这对有疑问的人有所帮助。

具有Angular 2的NGX数据表 - 包裹列的名称

2 个答案: