New to Kendo UI for Angular? Start a free 30-day trial
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]