我是
angularjs技术的新手.我正在使用ag-grid并想要动态显示列
我的json数据是：
[{Date:'12-12-2015',Name:'ammu',mark:20},{Date:'12-12-2015',Name:'appu',mark:24},Name:'anu',mark:27},{Date:'13-12-2016',mark:23},{Date:'13-12-2015',mark:20}]
我的预期输出是
Expected Output
现有守则如下
$scope.gridOptions = {
columnDefs: [],enableFilter: true,rowData: [],rowSelection: 'multiple',rowDeselection: true
};
$scope.customColumns = [];
Getdetails();
function Getdetails()
{
masterdataFactory.Getdetails()
.success(function (Student) {
f (Student.length != 0) {
for(var i=0;i<Student.length;i++) {
$scope.customColumns.push(
{
headerName: Student[i].Name,field: "Mark",headerClass: 'grid-halign-left'
}
);
};
$scope.gridOptions.columnDefs = $scope.customColumns;
$scope.gridOptions.rowData = Student;
$scope.gridOptions.api.setColumnDefs();
}
})
.error(function (error) {
$scope.status = 'Unable to load data: ' + error.message;
});
}
现有产出如下
Existing Output
解决方法
首先安排json数据
[{Date:'12-12-2015',ammu:20,appu:24,anu:27},{Date:'13-12-2016' ammu:23,anu:20}]
为此我正在使用以下代码
function generateChartData() {
var chartData = [],categories = {};
debugger;
for ( var i = 0; i <Student.length; i++ ) {
var newdate = Student[ i ].Date;
var Name=Student[ i ].Name;
var Mark=Student[ i ].Mark;
// add new data point
if ( categories[ newdate ] === undefined ) {
categories[ newdate ] = {
DATE: newdate
};
chartData.push( categories[ newdate ] );
}
// add value to existing data point
categories[ newdate ][ Name] = Mark;
}
return chartData;
}
网格选项如下：
$scope.gridOptions = {
columnDefs: coldef(),rowDeselection: true,enableColResize: true,}
};
$scope.gridOptions.columnDefs = $scope.customColumns;
$scope.gridOptions.rowData =generateChartData();
$scope.gridOptions.rowData = generateChartData();
}
列定义是动态的,如下所示
function coldef()
{
for(var i=0;i<headers.length;i++) {
debugger;
$scope.customColumns.push(
{
headerName: headers[i],field:headers[i],headerClass: 'grid-halign-left',width:180,filter: 'set',});
} }
在这个标题中是一个数组.此数组包含不同的学生姓名
var headers=new Array();
headers[0]="DATE";
var Names= Student.map(function (item) { return item.Name});
Names= Names.filter(function (v,i) { return Names.indexOf(v) == i; });
for(var i=1;i<=Names.length;i++)
{
headers[i]=Names[i-1];
}
