NativeScript Snacks

        
import {Component, OnInit, OnDestroy, AfterViewInit, ViewChild, ElementRef} from '@angular/core';
import {Page} from 'ui/page';
import {SegmentedBar, SegmentedBarItem, SelectedIndexChangedEventData} from 'ui/segmented-bar';
@Component({
    selector: 'tabs',
    template: '<SegmentedBar #tabs [items]="items" [selectedIndex]="selectedIndex"></SegmentedBar>'
})
export class TabsComponent implements OnInit, OnDestroy, AfterViewInit {
    selectedIndex: number;
    items: Array;
    @ViewChild("tabs") tabs: ElementRef;
    constructor(private router: Router, private page: Page) {
        this.selectedIndex = 0;
        this.items = [{ title: 'First' }, { title: 'Second' }, { title: 'Third' }];
}
    ngOnInit() {

    }
    ngAfterViewInit() {
        this.tabs.nativeElement.on(SegmentedBar.selectedIndexChangedEvent, (args: SelectedIndexChangedEventData) => {
            switch (args.newIndex) {
                case 0:
                    console.log('first selected')
                    break;
                case 1:
                    console.log('second selected')
                    break;
                case 3:
                    console.log('third selected')
                    break;
            }
        })
    }
    ngOnDestroy() { }
}

		</code>
      </pre>
    </div>
  </li>
    
</ul>