diff --git a/ionic/components/segment/test/swipe/index.ts b/ionic/components/segment/test/swipe/index.ts new file mode 100644 index 0000000000..1ffab619b0 --- /dev/null +++ b/ionic/components/segment/test/swipe/index.ts @@ -0,0 +1,58 @@ +import {Validators, Control, ControlGroup} from 'angular2/common'; +import {Http} from 'angular2/http'; +import {App, Page, IonicApp, NavController} from 'ionic/ionic'; +import _ from 'lodash'; + + +@Page({ + templateUrl: 'main.html', +}) +class SegmentPage { + constructor(app: IonicApp) { + this.app = app; + + this.selectedSegment = "first"; + this.slides = [ + { + id: "first", + title: "First Slide" + }, + { + id: "second", + title: "Second Slide" + }, + { + id: "third", + title: "Third Slide" + } + ]; + } + + onSegmentChanged(segmentButton) { + console.log("Segment changed to", segmentButton.value); + + this.sliderComponent = this.app.getComponent('loopSlider'); + const selectedIndex = this.slides.findIndex((slide) => { + return slide.id === segmentButton.value; + }); + this.sliderComponent.slider.slideTo(selectedIndex); + } + + onSlideChanged(slider) { + console.log('Slide changed', slider); + + const currentSlide = this.slides[slider.activeIndex]; + this.selectedSegment = currentSlide.id; + } +} + + +@App({ + pages: [SegmentPage], + template: `` +}) +class MyApp { + constructor() { + this.root = SegmentPage; + } +} diff --git a/ionic/components/segment/test/swipe/main.html b/ionic/components/segment/test/swipe/main.html new file mode 100644 index 0000000000..93818cae7b --- /dev/null +++ b/ionic/components/segment/test/swipe/main.html @@ -0,0 +1,35 @@ + + + Segment Swipeable under Navbar + + + + + + First + + + Second + + + Third + + + + + + + + +

{{ slide.title }}

+
+
+ +
+ +