在 Kendo UI 中为 Angular 创建动态网格

Question

Kendo UI for Angular 有一个网格可以定义如下：

<kendo-grid [data]="gridData" [height]="410">
            <kendo-grid-column field="ProductID" title="ID" width="40">
            </kendo-grid-column>
            <kendo-grid-column field="ProductName" title="Name" width="250">
            </kendo-grid-column>
            <kendo-grid-column field="Category.CategoryName" title="Category">
            </kendo-grid-column>
            <kendo-grid-column field="UnitPrice" title="Price" width="80">
            </kendo-grid-column>
</kendo-grid>

但我需要做的是动态构建列。类似于：

var grid = new KendoGrid();
var column = new KendoGridColumn();
grid.add(column);

这可能吗？

Answer 1

据我所知，您无法创建这样的网格。

或者您可以通过 ngFor.

生成列

public columns = [
    { field:'ProductID', title:'ID', width:250 },
    { field:'Category.CategoryName', title:'Category' }
];

html

<kendo-grid [data]="gridData" [height]="410">
    <kendo-grid-column
        *ngFor="let column of columns"
        [field]="column.field"
        [title]="column.title"
        [width]="column.width">
    </kendo-grid-column>
</kendo-grid>

在 Kendo UI 中为 Angular 创建动态网格

Creating dynamically grid in Kendo UI for Angular

kendo-ui

kendo-ui-angular2

angular