Question

我正在研究农业网格组件。在此网格中，我仅需绑定垂直格式的列。假设我有一个数组[“ 0.1”，“ 0.4”，“ cn”，“ abc”]，并且必须在如下所示的ag-grid组件中显示它，而我没有任何rowData。

    0.1
---------------------------------
    0.4
---------------------------------
    cn
---------------------------------
    abc
--------------------------------

是否可以使用ag-grid以垂直格式绑定以上数组。或还有其他解决方案，请提供任何帮助。预先感谢。

我的html文件：

<ag-grid-angular 
    style="width: 500px; height: 500px;" 
    class="ag-theme-balham"
    [rowData]="rowData" 
    [columnDefs]="columnDefs"
    >
</ag-grid-angular>

Answer 1

您可以尝试：

export class MyGridApplicationComponent {
    public gridOptions: GridOptions;
    public myArray =  ["0.1", "0.4", "cn", "abc"] ;

    constructor() {
        this.gridOptions = <GridOptions>{
          enableSorting: true,
          enableFilter: true
        };
        this.gridOptions.columnDefs = [
            {
                headerName: "",
                field: "value",
                width: 100
            }
        ];
        this.gridOptions.rowData = 
        this.myArray.map(function(item) {
  return {"value":item};
})
}
}

和html中的

<div style="width: 100px;">
    <ag-grid-angular #agGrid style="width: 100%; height: 200px;" class="ag-theme-fresh" [gridOptions]="gridOptions">
    </ag-grid-angular>
</div>

DEMO

如何将数组动态绑定到ag-grid列

1 个答案: