使用igx-action-strip为igx grid添加新行时addRow属性找不到如何解决

1. 核心原因：API版本不匹配 #

你当前使用的Angular 12 对应支持的最高 Ignite UI for Angular 版本为 12.2.x，igx-grid-editing-actions 组件的 [addRow] 输入属性是 13.0.0 及以上版本才新增的API，低版本不存在该属性，因此会抛出属性不存在的运行时错误。

2. 依赖检查补充 #

除了已引入的 IgxActionStripModule，你还需要在app.module.ts中额外引入两个关联模块：

• IgxGridModule（核心网格模块）
• IgxGridEditingActionsModule（网格编辑动作专属模块）

引入示例代码：

import { IgxGridModule, IgxActionStripModule, IgxGridEditingActionsModule } from 'igniteui-angular';

@NgModule({
  imports: [
    // 其他现有引入
    IgxGridModule,
    IgxActionStripModule,
    IgxGridEditingActionsModule
  ]
})
export class AppModule { }

3. 适配Angular 12的替代实现方案 #

如果暂时不打算升级Angular和Ignite UI版本，可以用12.x版本支持的写法实现相同的行添加效果：

第一步：给网格组件开启行编辑、绑定动作条 #

<igx-grid [data]="yourData" [rowEditable]="true" #grid>
  <igx-action-strip #actionStrip>
    <igx-grid-editing-actions></igx-grid-editing-actions>
    <button igxButton (click)="grid.beginAddRowByIndex(0)">新增行</button>
  </igx-action-strip>
</igx-grid>

第二步：可选配置 #

如果需要点击后在指定位置插入行，可以调整beginAddRowByIndex的入参，传入要插入的位置索引即可。

4. 原生[addRow]属性使用方案 #

如果需要直接使用你示例里的[addRow]属性，请先将Angular版本升级到13.0及以上，同步升级Ignite UI for Angular到13.0及以上版本即可。

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