New to Kendo UI for Angular? Start a free 30-day trial
HeaderTemplateDirective
Allows customizing the header content of the ListView. To define a header template, nest an <ng-template>
tag
with the kendoListViewHeaderTemplate
directive inside the <kendo-listview>
tag
(see example).
typescript
@Component({
template: `
<kendo-listview [data]="items">
<ng-template kendoListViewHeaderTemplate>
<div class="header-content">
<h3>Product List</h3>
<button kendoListViewAddCommand>Add New Item</button>
</div>
</ng-template>
</kendo-listview>
`
})
export class AppComponent { }
Selector
[kendoListViewHeaderTemplate]