如何在 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-community/angular

，而不是旧的 ag-grid-angular

所以现在，如果使用企业版，你所有的依赖项应该看起来像这样：

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

正在注册模块

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

您可以将所有模块全局注册到您 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 Modules: Migrating