使用 AG-Grid , Angular 和 TypeScript 如何动态设置 Column ColSpan
Using AG-Grid , Angular and TypeScript how to set the Column ColSpan dynamically
给定行数据如下:
rowData = [
{ field_1 : value_1_1 , field_2 : value_1_2 , colSpan : 1 } ,
{ field_1 : value_2_1 , colSpan : 2} ,
{ field_1 : value_3_1 , field_2 : value_3_2 , colSpan : 1}
];
列定义如下:
columnDefs = [
{
header : field_1_name ,
field : field_1 ,
colSpan : getColSpan(params)
} ,
{
header : field_2_name ,
field : field_2
}
];
对于 getColSpan 函数,可以使用什么 TypeScript 语法来实现下面的伪代码段? :
getColSpan(params)
return colSpan value for each row
生成的网格应如下所示:
如演示示例 Simple Column Spanning 中所述,您可以使用如下 colSpan
函数来获得您期望的结果。
{
header : field_1_name,
field : field_1,
colSpan : function(params) {
var value = params.data.field_1;
if (value === "value_2_1") {
return 2;
} else {
return 1;
}
}
}
给定行数据如下:
rowData = [
{ field_1 : value_1_1 , field_2 : value_1_2 , colSpan : 1 } ,
{ field_1 : value_2_1 , colSpan : 2} ,
{ field_1 : value_3_1 , field_2 : value_3_2 , colSpan : 1}
];
列定义如下:
columnDefs = [
{
header : field_1_name ,
field : field_1 ,
colSpan : getColSpan(params)
} ,
{
header : field_2_name ,
field : field_2
}
];
对于 getColSpan 函数,可以使用什么 TypeScript 语法来实现下面的伪代码段? :
getColSpan(params)
return colSpan value for each row
生成的网格应如下所示:
如演示示例 Simple Column Spanning 中所述,您可以使用如下 colSpan
函数来获得您期望的结果。
{
header : field_1_name,
field : field_1,
colSpan : function(params) {
var value = params.data.field_1;
if (value === "value_2_1") {
return 2;
} else {
return 1;
}
}
}