升级ag-grid后报reading 'iterateObject'错误且表格无法渲染如何解决

问题原因 #

该报错是由于 ag-grid-angular 和 ag-grid-community 两个依赖的版本不匹配导致的。iterateObject 是 ag-grid-community 内置工具模块的导出方法，当 ag-grid-angular 调用该方法时找不到对应实例，就会抛出这个未定义错误。

解决步骤 #

• 先卸载所有本地现有ag-grid相关依赖：

  # npm 环境
  npm uninstall ag-grid-community ag-grid-angular
  # yarn 环境
  yarn remove ag-grid-community ag-grid-angular
  

• 安装版本完全一致的依赖，推荐选择刚好满足autocomplete编辑器最低要求的23.2.1版本：

  # npm 环境
  npm install ag-grid-community@23.2.1 ag-grid-angular@23.2.1
  # yarn 环境
  yarn add ag-grid-community@23.2.1 ag-grid-angular@23.2.1
  

  注意两个包的版本号必须完全一致，禁止单独升级某一个包。
• 清除本地缓存并重建项目：删除根目录下的 node_modules 文件夹、package-lock.json 或 yarn.lock 文件，重新执行安装依赖命令后再运行项目构建指令，避免之前的 Ivy 编译缓存残留导致异常。
• 如果依旧报错，检查本地Angular版本适配性：ag-grid 23.2.1仅支持Angular 8.x ~ 11.x版本，若本地Angular版本高于11，可以将ag-grid统一升级到25.x版本，该版本同样兼容你要使用的autocomplete编辑器组件，且适配更高版本的Angular。

操作完成后重新启动项目，表格即可正常渲染，之后按需求配置autocomplete编辑器就能正常测试功能。

内容的提问来源于stack exchange，提问作者Tejas Jaggi