New to Kendo UI for Angular? Start a free 30-day trial

GroupHeaderColumnTemplateDirective

Directive

Represents the group-header column template of the Grid, allowing customization of group header content. To define the group header template, nest an <ng-template> tag with the kendoGridGroupHeaderColumnTemplate directive inside a <kendo-grid-column>. See example.

The template context is set to the current data item and provides the following fields:

group—The current group item.
field—The name of the field used for grouping.
value—The current group value.
aggregates—Aggregate values for the current group.

Definition

Package:@progress/kendo-angular-grid

Selector:[kendoGridGroupHeaderColumnTemplate]

Syntax:

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>