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

を、私は同様の問題に直面し、[応答を除去することによって、それを解決することができました]プロパティを使用します。

I have posted an answer here