Primeng可扩展列标题不显示

Question

我使用Primeng2在Angular2中有一个可扩展的行，但是没有显示可扩展列的列标题。

这是我的表格，其中包含可扩展的行：

   <p-dataTable [value]="activetrucks" expandableRows="true" [(selection)]="selectedtruck">
  <p-header>
    List of Active trucks

  </p-header>
  <p-column expander="true"></p-column>
  <p-column field="owner_id" header="Transporter"></p-column>
  <p-column field="reg_no" header="Truck number"></p-column>
  <p-column field="truck_category" header="Truck type" ></p-column>

  <template let-user pTemplate="rowexpansion">  //headers dont show
    <div class="ui-grid ui-grid-responsive ui-fluid"> 
      <p-dataTable [value]="stages" [paginator]="true" [pageLinks]="3">
        <p-header>
          The different stages
        </p-header>
        <p-column field="status" header="Status"></p-column>  
        <p-column field="created_at" header="Done by"></p-column>
        <p-column field="created_by" header="Date"></p-column>

        <p-column styleClass="col-button">
          <template let-truck="rowData" pTemplate="body">
            <button type="button" pButton (click)="onremoveTruck(truck)" icon="fa-remove"></button>
          </template>
        </p-column>

      </p-dataTable>
    </div>
  </template>

</p-dataTable>

在展开行中，标题不显示，如下图所示。

可能出现什么问题？

Answer 1

使用以下内容创建或编辑css文件：

th .ui-column-title {
    display: inline !important;
}

编辑您的组件文件：

import {ViewEncapsulation} from '@angular/core';

@Component({
  ...
  styleUrls: ['file.css'],
  encapsulation: ViewEncapsulation.None
})

Answer 2

我遇到了类似的问题，并且能够通过从表定义中删除[responsive]属性来解决它。

I have posted an answer here