All Components

TabTitleDirective

Represents the title template of the Kendo UI Tabstrip.

To define the template, nest a <template> tag with the kendoTabTitle directive inside a <kendo-tabstrip-tab>.


@Component({
    selector: 'my-app',
    template: `
        <kendo-tabstrip [ngStyle]="{'width': '400px'}" [animations]="true">
          <kendo-tabstrip-tab [title]="'Paris'" [selected]="true">
            <template kendoTabTitle>
              Title
            </template kendoTabTitle>
            <template kendoTabContent>
              <h3>Content 1</h3>
            </template>
          </kendo-tabstrip-tab>

          <kendo-tabstrip-tab [title]="'Sofia'">
            <template kendoTabContent>
              <h3>Content 2</h3>
            </template>
          </kendo-tabstrip-tab>
        </kendo-tabstrip>
    `
})

class AppComponent {}

Selector

[kendoTabTitle]

In this article