Блог

Моя версия ag-grid-angular была обновлена до 24.0.0. в процессе обновления Angular 10 (обновление npm — all). Все работает нормально с точки зрения функциональности, внешнего вида компонентов angular material и сторонних библиотек, которые я использую (например, ag-angular-grid, Highchart, splitter, ag-grid и т. Д.).

Но каким-то образом я потерял внешний вид выпадающего списка ag-angular-grid по умолчанию (редактирование grid — CellEditor: ‘agSelectCellEditor’)

Вот сравнение внешнего вида до и после обновления для большей ясности.

Версия после обновления angular 10 (package.json):

 "@angular-devkit/build-angular": "^0.1001.1",
"@angular/animations": "^10.1.2",
"@angular/cdk": "^10.2.1",
"@angular/common": "^10.1.2",
"@angular/compiler": "^10.1.2",
"@angular/core": "^10.1.2",
"@angular/flex-layout": "^10.0.0-beta.32",
"@angular/forms": "^10.1.2",
"@angular/http": "^7.2.16",
"@angular/material": "^10.2.1",
"@angular/platform-browser": "^10.1.2",
"@angular/platform-browser-dynamic": "^10.1.2",
"@angular/router": "^10.1.2",
"@types/jest": "^26.0.14",
"ag-grid-angular": "^24.0.0",
"ag-grid-community": "^24.0.0",
  

Ценю вашу помощь.

Импорт css-файлов ag-grid и ag-theme-material в styles.scss решил проблему. Спасибо Крису за руководство и документацию. https://www.ag-grid.com/javascript-grid-themes-v23-migration /

Импортируйте эти файлы в файл «styles.scss», как показано ниже, вот и все!

 @import "~ag-grid-community/dist/styles/ag-grid.css";
@import "~ag-grid-community/dist/styles/ag-theme-material.css";
  

или

 @import "~ag-grid-community/src/styles/ag-grid";
@import "~ag-grid-community/src/styles/ag-theme-material/sass/legacy/ag-theme-material-v22-compat";