var app = angular.module('MyApp', ['ui.grid']);
app.controller('MyCtrl', ['$scope',
function($scope) {
$scope.myData = [
{name: "product-a", avg1: 10.5, count1: 50, avg2: 28.3, count2: 24},
{name: "product-b", avg1: 13.5, count1: 33, avg2: 14.3, count2: 54},
{name: "product-c", avg1: 50.5, count1: 10, avg2: 64.3, count2: 91},
{name: "product-d", avg1: 56.1, count1: 60, avg2: 18.3, count2: 35},
{name: "product-e", avg1: 17.5, count1: 56, avg2: 68.3, count2: 13}
];
$scope.gridOptions = {
data: 'myData',
columnDefs: [
{field: 'name', displayName: 'Name',width:"80"},
{field: 'avg1', displayName: 'Avg', categoryDisplayName: '2013',width:"80"},
{field: 'count1', displayName:'Count', categoryDisplayName: '2013',width:"80"},
{field: 'avg2', displayName: 'Avg', categoryDisplayName: '2014',width:"80"},
{field: 'count2', displayName:'Count', categoryDisplayName: '2014',width:"80"},
]
}
}
])
.directive('categoryHeader', function() {
function link(scope) {
console.log(scope.gridOptions.columnDefs);
scope.headerRowHeight = 30;
scope.catHeaderRowHeight = scope.headerRowHeight + 'px';
scope.categories = [];
var lastDisplayName = "";
var totalWidth = 0;
:
:
see
"https://github.com/angular-ui/ng-grid/issues/644"
"http://plnkr.co/edit/lZk3YB?p=preview"
:
:
}
return {
templateUrl: '../wp-content/themes/wp/category_header.html',
link: link
};
});
(grid.css)
.myGrid {
height: 300px;
}