2017-03-20 2 views
1

J'ai un ngx-datatable avec Angular 2 qui a des noms de colonnes très longs. Je voudrais reproduire ce qu'ils font avec la hauteur automatique pour la ligne (Link to Documentation), mais se contenterait d'obtenir les noms vraiment longs pour envelopper plusieurs lignes.NGX-Datatable avec Angular 2 - Wrap Nom de la colonne

Normalement, ce ne serait pas un problème, mais avec ma nouveauté à Angular je suis coincé. Les choses normales comme l'overflow ou l'enrubannage ne semblent pas fonctionner. Toute aide et/ou conseil serait apprécié. Merci!

Mon code actuel:

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

Répondre

3

Ajouter cela à la CSS a fait l'affaire. Il a également centré et aligné verticalement les en-têtes de colonnes.

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