Текст ячейки заголовка с датой Ngx не выровнен по вертикали - PullRequest
0 голосов
/ 22 января 2019

Я использую ngx-datatable в моем угловом проекте. Столбцы -> «Расчетная производительность», «Wk1Rate», «WK2Rate», «WK3Rate».

Я применил обтекание к тексту, используя css, чтобы вместить текст - «Расчетная производительность» в ячейке заголовка. Таким образом, предполагаемая норма производства отображается в 3 строки, а названия других столбцов отображаются в одну строку. headerheight 'auto', выравнивание текста для ячеек заголовка 'center'

Проблема - Тексты - "Wk1Rate", "WK2Rate", "WK3Rate" - не выровнены по вертикали в ячейке заголовка. эти тексты показаны сверху, как показано на рисунке:

enter image description here

Как сделать так, чтобы эти столбцы выравнивались по центру по вертикали? я пробовал вертикальное выравнивание: среднее, но не работает. Пожалуйста, помогите.

HTML-код для ngx-datatable:

    <ngx-datatable class="material" [rows]="MyRows" [headerHeight]="'auto'" [footerHeight]="40"
     [rowHeight]="37" [limit]="10">
        <ngx-datatable-column name="Est Production Rate" [sortable]="false" 
         [width]="85">
            <ng-template ngx-datatable-cell-template let-value="value">
                {{value}}
            </ng-template>
        </ngx-datatable-column>
        <ngx-datatable-column name="Wk1Rate" [width]="80">
            <ng-template ngx-datatable-cell-template let-value="value">
                {{value}}
            </ng-template>
        </ngx-datatable-column>

        <ngx-datatable-column name="Wk2Rate" [width]="80">
            <ng-template ngx-datatable-cell-template let-value="value">
                {{value}}
            </ng-template>
        </ngx-datatable-column>

        <ngx-datatable-column name="Wk3Rate" [width]="80">
            <ng-template ngx-datatable-cell-template let-value="value">
                {{value}}
            </ng-template>
        </ngx-datatable-column>
    </ngx-datatable>

stackblitz

Ответы [ 2 ]

0 голосов
/ 04 июля 2019

Это работает для меня

.ngx-datatable .datatable-body .datatable-body-row > div {
   align-items: center;
}

0 голосов
/ 23 января 2019

Попробуйте это в стилях globle.

.datatable-header-cell
{
   display: flex !important;
   align-items: center !important;
}
...