New to Kendo UI for jQuery? Download free 30-day trial

Template Directives

You can specify the template options of data-bound container widgets as nested directives.

The following table provides information on the template directives that are supported by the Kendo UI widgets.

TreeMap k-template
MobileListView k-header-template and k-template
MobileScrollView k-empty-template and k-template
Grid k-alt-row-template, k-detail-template, and k-row-template
ListView k-edit-template, k-template, and k-alt-template
Pager k-select-template and k-link-template
PivotGrid k-column-header-template, k-data-cell-template, and k-row-header-template
Scheduler k-all-day-event-template, k-date-header-template, k-event-template, k-major-time-header-template, and k-minor-time-header-template
TreeView k-template
Validator k-error-template
    <div ng-app="app" ng-controller="MyCtrl">
      <div kendo-list-view k-data-source="source">
        <!-- the template (including the div tag itself) here will be assigned as a string to the `template` configuration option of the listview widget -->
        <div class="product" k-template>
            <img ng-src="{{dataItem.ProductID}}.jpg" alt="{{dataItem.ProductName}} image" />
            <h3>{{ dataItem.ProductName }}</h3>
            <p>{{ dataItem.UnitPrice | currency:"USD$":0 }}</p>
    angular.module("app", ["kendo.directives"]).controller("MyCtrl", function($scope) {
       $scope.source = new{
         transport: {
           read: {
             url: "",
             dataType: "jsonp"
         pageSize: 21

See Also

In this article