New to Kendo UI for Angular? Start a free 30-day trial
GroupFooterTemplateDirective
The directive allows customizing the group footer cell for a column in the Grid.
To set the group footer template, nest an <ng-template>
tag with the kendoGridGroupFooterTemplate
directive inside <kendo-grid-column>
.
The template context uses the current data item and provides these fields:
column
—An instance of theColumnComponent
option.field
—The current column field name.group
—The current group data item.aggregates
—All aggregate values for the current group.
html
<kendo-grid [data]="gridData" [group]="groups">
<kendo-grid-column field="ProductName" title="Product Name">
<ng-template kendoGridGroupFooterTemplate let-aggregates let-field="field">
Count: {{aggregates[field].count}}
</ng-template>
</kendo-grid-column>
</kendo-grid>
Selector
[kendoGridGroupFooterTemplate]