#javascript #angular #typescript #ag-grid #ag-grid-angular
#javascript #angular #typescript #ag-grid #ag-grid-angular
Вопрос:
Я новичок в ag-grid. Как видно на скриншоте ниже, изначально у меня есть 4 столбца. Когда я удаляю столбец 3 (test3), обратите внимание, что справа есть пробел, который указывает на отсутствие столбца. Как я могу гарантировать, что после удаления столбца оставшиеся 3 столбца (в данном случае) заполнят область? Я попытался перейти resizable : true в defaultcolDef , но это не устранило проблему…
Комментарии:
1. используйте
api.sizeColumnsToFit()после операции удаления, чтобы убедиться, что оставшиеся столбцы соответствуют доступной ширине
Ответ №1:
Используйте flex: 1 для каждого столбца.
Смотрите Документацию здесь для получения дополнительной информации: https://www.ag-grid.com/javascript-data-grid/column-sizing/#column-flex
Или проверьте этот пример plunker: https://plnkr.co/edit/7evoWXCM1sChDBmX
Просто перетащите один из столбцов из сетки, чтобы увидеть, как он работает
Ответ №2:
Вы можете использовать событие columnVisible-event для отслеживания любых добавленных или удаленных столбцов
https://www.ag-grid.com/javascript-data-grid/grid-events/#reference-columns-columnVisible
а затем вызвать
gridOptions.api.sizeColumnsToFit();
https://www.ag-grid.com/javascript-data-grid/column-sizing/#size-columns-to-fit