动态Kendo UI网格

时间:2015-08-18 08:40:00

标签: kendo-ui angular-kendo kendo-ui-grid

我面临动态创建的kendo UI网格的问题。 当我使用 title field 属性指定columns数组并渲染网格时,网格列不会显示指定的 title 而是显示 field 名称。我不希望字段名称显示为原样,因为字段名称本身作为列标题没有意义。

注意:这是在角度控制器内完成的。

这是我的网格定义

<div kendo-grid="ctrl.commonGrid" options="ctrl.commonGridOptions"></div>

以下是我用来生成列的代码。

var columns = [];

angular.forEach(ctrl.ColumnConfig, function (col) { var newCol ={ title: col.displayName, field: col.mappingProperty.toCamelCase(), } columns.push(newCol); });

在此之后,我将其分配给网格列集合

ctrl.commonGridOptions = { columns: columns, };

然后只使用网格dataSource数据方法填充数据。

ctrl.commonGrid.dataSource.data(ctrl.TableData);

我从昨天开始摸不着头脑,但却无法弄清楚什么是错的。

任何人都可以帮助我。

谢谢

1 个答案:

答案 0 :(得分:0)

好的我修好了。以下是按预期工作的代码。 firstRow只是我从服务器获取的对象列表中的行,而columnConfig是我想要显示的列的配置。

for (var property in firstRow) { if (firstRow.hasOwnProperty(property)) { model.fields[property] = { type: 'string' }; var col = $.grep(ctrl.columnConfig, function (e) { return e.mappingProperty === property }); if (col.length) { columns.push({ title: col[0].displayName, field: col[0].mappingProperty }); } } }