автоматическая высота ag-сетки для всей сетки

Я не могу найти хороший способ по размеру сетки идеально подогнать все строки.

документация указывает только на размер по% или px.

Поскольку я хочу, чтобы размер был основан на строках, я придумал следующую функцию. Кажется, что я снова изобретаю колесо, так что, может быть, есть лучший способ?

getHeight(type:EntityType) {
    var c = this.Apis[type] && this.Apis[type].api && this.Apis[type].api.rowModel // get api for current grid
        ? this.Apis[type].api.rowModel.rowsToDisplay.length
        : -1;
    return c > 0
        ? (40+(c*21))+'px' // not perfect but close formula for grid height
        : '86%';
}

должен быть менее грязный способ.

Ответ 1

Я столкнулся с этим решением:

https://github.com/ag-grid/ag-grid/issues/801

На эту проблему есть 2 ответа.

1) Если вы используете что-либо ниже v10.1.0, вы можете использовать следующий CSS для решения этой проблемы:

.ag-scrolls {
    height: auto !important;
}

.ag-body {
    position: relative !important;
    top: auto !important;
    height: auto !important;
}

.ag-header { 
    position: relative !important;
}

.ag-floating-top {
    position: relative !important;
    top: auto !important;
}

.ag-floating-bottom {
    position: relative !important;
    top: auto !important;
}

.ag-bl-normal-east,
.ag-bl-normal,
.ag-bl-normal-center,
.ag-bl-normal-center-row,
.ag-bl-full-height,
.ag-bl-full-height-center,
.ag-pinned-left-cols-viewport,
.ag-pinned-right-cols-viewport,
.ag-body-viewport-wrapper,
.ag-body-viewport {
    height: auto !important;
}

2) Что-то выше v10.1.0, теперь есть свойство, называемое "domLayout".

https://www.ag-grid.com/javascript-grid-width-and-height/#autoHeight

Ответ 2

Использовать этот:

 this.gridApi.sizeColumnsToFit();

Ссылка

Ответ 3

Добавьте следующий код в функцию onGridReady для автоматической ширины и автоматической высоты

onGridReady = params => {
   // Following line to make the currently visible columns fit the screen  
   params.api.sizeColumnsToFit();

   // Following line dymanic set height to row on content
   params.api.resetRowHeights();
};

ссылка Авто Высота Авто ширина