New to Kendo UI for Angular? Start a free 30-day trial
GroupHeaderColumnTemplateDirective
Represents the group-header column template of the Grid which helps to customize the content of the group headers.
To define the group header template, nest an <ng-template>
tag with the kendoGridGroupHeaderColumnTemplate
directive inside <kendo-grid-column>
. (See example).
The template context is set to the current data item and the following additional fields are passed:
group
—The current group item.field
—The name of the field by which data is grouped.value
—The current group value.aggregates
—All aggregate values for the current group.
html
<kendo-grid-column field="ProductName" title="Product Name">
<ng-template kendoGridGroupHeaderColumnTemplate let-group="group" let-aggregates="aggregates">
<span title="Group Header Column Template for ProductName">
Count: {{ aggregates.Discontinued.count }}
</span>
</ng-template>
</kendo-grid-column>
Selector
[kendoGridGroupHeaderColumnTemplate]