2016-10-11 11 views
2

Пожалуйста, дайте мне знать точный синтаксис для угловой 2 вкладки на выбранном событии. Я пытался что-то вроде:Как использовать select EventEmitter Angular 2 TabstripComponent

@Component({ 
    selector: 'my-app', 
    template: ` 
    <kendo-tabstrip> 
     <kendo-tabstrip-tab [title]="'Paris'" (select)="onTabSelected()"> 
      <span class="rainy">&nbsp;</span> 
      <div class="weather"> 
        <h2>17<span>&ordm;C</span></h2> 
        <p>Rainy weather in Paris.</p> 
      </div> 
     </kendo-tabstrip-tab> 
     <kendo-tabstrip-tab [title]="'New York'" (select)="onTabSelected()"> 
      <span class="sunny">&nbsp;</span> 
      <div class="weather"> 
        <h2>29<span>&ordm;C</span></h2> 
        <p>Sunny weather in New York.</p> 
      </div> 
     </kendo-tabstrip-tab> 
    </kendo-tabstrip> 
    ` 
}) 
class AppComponent { 
    public onTabSelected() { 
    console.log('index'); 
    } 
} 

Но это не сработало для меня.

+1

Вы должны будете смотреть в документации на 'кендо-tabstrip- tab'. Это не встроенная функция Angular 2. Откуда вы узнали о своем событии 'select'? – BeetleJuice

+0

Событие select @BeetleJuice является частью компонента «kendo-tabstrip». Пожалуйста, проверьте мой ответ ниже. – Sanket

ответ

1

выберите EventEmitter является частью кендо-TabStrip (TabstripComponent) и не кендо-Панель вкладок вкладками (TabstripTabComponent)

Вы можете использовать его как this-

<kendo-tabstrip (select)="onTabSelected($event)"> 
    <kendo-tabstrip-tab [title]="'tab1'" [selected]="true"> 
     Kendo UI - Tab Strip Demo 
    </kendo-tabstrip-tab> 
    .... 
    .... 

, а в компоненте вы можете прочитать название, подобное этому, -

Ссылка: http://www.telerik.com/kendo-angular-ui/components/layout/api/TabstripComponent/

1

tabSelect событие TabStripComponent работал для меня.

В компоненте шаблона:

<kendo-tabstrip (tabSelect)="onTabSelected($event)"> 
    <kendo-tabstrip-tab [title]="'tab1'" [selected]="true"> 
     Kendo UI - Tab Strip Demo 
    </kendo-tabstrip-tab> 
    .... 
    .... 

В классе компонента:

onTabSelected(event: any){ 
    console.log('Tab Title: ' + event.title); 
} 

Ссылка: http://www.telerik.com/kendo-angular-ui/components/layout/api/TabStripComponent/

 Смежные вопросы

  • Нет связанных вопросов^_^