<link href="http://www.example.com/wp/wp-content/themes/ang/css/ng-grid.min.css" rel="stylesheet">
<link href="http://www.example.com/wp/wp-content/themes/ang/css/grid1.css" rel="stylesheet">
<script type='text/javascript' src='http://www.example.com/wp/wp-content/themes/ang/js/ng-grid.min.js'></script>
<script type='text/javascript' src='http://www.example.com/wp/wp-content/themes/ang/js/grid1.js'></script>
<div ng-controller="MyCtrl">
<div class="row">
<div class="col-sm-12">
<div category-header="gridOptions"></div>
<div class="gridStyle" ng-grid="gridOptions">
</div>
</div>
</div>
</div>
var myApp = angular.module('googleMapApp', ['ui.bootstrap','ngGrid']);
myApp.controller('MyCtrl', 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'},
{field: 'avg1', displayName: 'Avg', categoryDisplayName: '2013'},
{field: 'count1', displayName:'Count', categoryDisplayName: '2013'},
{field: 'avg2', displayName: 'Avg', categoryDisplayName: '2014'},
{field: 'count2', displayName:'Count', categoryDisplayName: '2014'}
]
};
});
myApp.directive('categoryHeader', function() {
function link(scope, element, attrs) {
:
:
see
"https://github.com/angular-ui/ng-grid/issues/644"
"http://plnkr.co/edit/hRYMM03y0cOMFxcgG6dR"
:
:
createCategories(null, scope.categoryHeader.$gridScope.columns);
}
return {
scope: {
categoryHeader: '='
},
restrict: 'EA',
templateUrl: '../wp-content/themes/ang/assets/templates/category_header.html
',
link: link
};
});