AG Grid 设置动态行数据名称无法在“元素”上执行“setAttribute”答案

【问题标题】：AG Grid setting dynamic row data name Failed to execute 'setAttribute' on 'Element'AG Grid 设置动态行数据名称无法在“元素”上执行“setAttribute”
【发布时间】：2021-10-09 23:35:54
【问题描述】：

我正在使用角度 ag-grid，并且我正在尝试在数据源 [rowData] 中使用动态 gridData 名称。当我尝试将“i”附加到 gridDataName 时，我不断收到错误消息。在我的情况下可能出现什么问题？我试过了

[rowData]="gridData"+i
[rowData]="gridData"+${i}
[rowData]="gridData${i}" 等

未能在“元素”上执行“setAttribute”：“+i”

<div *ngFor="let item of apiList; let i = index">
                    
    <ag-grid-angular [rowData]="gridData"+i>
    </ag-grid-angular>

</div>

在 typescript 端，来自不同 api 的数据被分配给 griddata，名称后加数字。

this.gridData1 = 'make call to api1 get data'
this.gridData2 = 'make call to api2 get data'
this.gridData3 = 'make call to api2 get data'

this.apiList = ['api1', 'api2', 'api3']

【问题讨论】：

标签： angular ag-grid ag-grid-angular

【解决方案1】：

把代码改成这样：

this.myObject.gridData1 = 'make call to api1 get data'
this.myObject.gridData2 = 'make call to api2 get data'
this.myObject.gridData3 = 'make call to api2 get data'

<ag-grid-angular [rowData]="myObject['gridData' + i]">
</ag-grid-angular>

或者你可能只是这样做：

<ag-grid-angular [rowData]="this['gridData' + i]">
</ag-grid-angular>

【讨论】：

这是使用 rowData 索引的好方法。