如何在 Angular 8 中将 Ag-Grid 从版本 21 迁移到版本 22

Question

在版本 22 中，Ag-grid 从根本上改变了他们的代码，因此现在将其部署在模块中，主要来自两个新包 @ag-grid-community/all-modules 或 @ag-grid-enterprise/all-modules。他们网站上的文档完全不清楚如何成功迁移到新版本 22。特别是对于 Angular 应用程序。即使代码示例也不起作用（它们引用了未知模块@ag-grid-community/angular）。

有谁知道如何在 Angular 8 中将 Ag-Grid 从版本 21 迁移到版本 22？也欢迎任何有关企业版操作的信息。

Answer 1

如果还想使用所有模块和angular，设置如下：

添加 Ag-Grid 依赖项：

• 删除所有当前的 aggrid 依赖项。
• 如果您只想使用社区，只需添加 @ag-grid-community/all-modules
• 如果要使用企业版，只需添加@ag-grid-enterprise/all-modules，无需添加社区依赖，因为它已经包含在企业版中

添加 Angular 网格依赖项

而不是旧的ag-grid-angular，您现在应该使用@ag-grid-community/angular

所以现在，如果使用企业，您的所有依赖项应该如下所示：

"@ag-grid-community/angular": "^22.1.2",
"@ag-grid-enterprise/all-modules": "^22.1.2",

注册模块

现在是时候配置您的网格将使用哪些模块了。您可以按网格或全局配置它。

您可以将所有模块全局注册到您的所有网格app.module.ts：

import {ModuleRegistry, AllModules} from '@ag-grid-enterprise/all-modules';


export class AppModule {


  constructor() {
    ModuleRegistry.registerModules(AllModules);
  }
}

更改导入

现在确保将所有从旧包导入到新包中。

例如。

import {AgGridAngular} from "ag-grid-angular"; 

变成

import {AgGridAngular} from "@ag-grid-community/angular";

更新 CSS 导入

您需要确保所有 CSS 导入都更新到新的包系统。

例如，这个：

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

变成这样：

@import "~@ag-grid-community/all-modules/dist/styles/ag-grid.css";
@import "~@ag-grid-community/all-modules/dist/styles/ag-theme-balham.css";
@import "~@ag-grid-community/all-modules/dist/styles/ag-theme-blue.css";

有关更多信息，请查看ag-Grid 模块：迁移