GanttTaskTooltipTemplateDirective

Defines a template for the entire Task tooltip. Place an <ng-template> tag with the kendoGanttTaskTooltipTemplate directive inside the <kendo-gantt> tag to set the template.

The template context uses the related data item.

ts

@Component({
     selector: 'my-app',
     template: `
         <kendo-gantt [kendoGanttHierarchyBinding]="data">
             <ng-template kendoGanttTaskTooltipTemplate let-dataItem>
                 <div [style]="'color: white; font-size: 8px;'">
                     {{ dataItem.title }} - {{ dataItem.completionRatio * 100 }}% complete;
                 </div>
             </ng-template>
         </kendo-gantt>
     `
})
class AppComponent {
    public data: any[] = sampleTasks;
}

Selector

[kendoGanttTaskTooltipTemplate]