如何动态创建角度ag栅格

Question

我根据从API收到的响应从API调用中获取数据，我必须创建ag-grids。让我们考虑下面的例子。

data = ["Usage","Audit"];

由于我在数组中有两个元素，所以我必须创建两个ag-grids，数据的元素可以变化，可以是1，也可以是10。有人能告诉我如何实现吗

Answer 1

只需在模板中迭代data响应。

my-component.com组件.html

<div *ngFor="let gridName of data">
<ag-grid-angular [rowData]="allData[gridName]"
[columnDefinitions]="allColumnDefinitions[gridName]">
</ag-grid-angular>
</div>

my-component.component.ts

export class MyComponent {
data = ['One', 'Two'];
allData = {
One: [{first: '1'}, {first: '2'}, {first: '3'}],
Two: [{other: 'A'}, {other: 'B'}, {other: 'C'}]
}
allColumnDefinitions: {
One: [{field: 'first'}, {field: ''}],
Two: [{field: 'other'}, {field: ''}]
}
}