New to Kendo UI for AngularStart a free 30-day trial

ItemTemplateDirective

Allows customizing the list item content. To define an item template, nest an <ng-template> tag
with the kendoListViewItemTemplate directive inside the <kendo-listview> tag (see example).

The following values are available as context variables:

  • let-dataItem="dataItem" (any)&mdashThe current data item. Also available as implicit context variable.
  • let-index="index" (number)&mdashThe current item index.
  • let-isFirst="isFirst" (boolean)&mdashIndicates whether the current data item renders as the first item on the list.
  • let-isLast="isLast" (boolean)&mdashIndicates whether the current data item renders as the last item on the list.
typescript
@Component({
  template: `
    <kendo-listview [data]="items">
      <ng-template kendoListViewItemTemplate let-dataItem let-index="index">
        <div class="item-wrapper">
          <h4>{{ dataItem.name }}</h4>
          <p>Item #{{ index + 1 }}: {{ dataItem.description }}</p>
        </div>
      </ng-template>
    </kendo-listview>
  `
})
export class AppComponent { }

Selector

[kendoListViewItemTemplate]

In this article
Selector
Not finding the help you need?
Contact Support