I'm using ons-carousel at Angular2 and onsenUI2.
I want to detect changing carousel.
Maybe I can use at postchange, but can't understand how to use postchange.
this is my component
@Component({
selector: 'ons-page',
template: `
<ons-toolbar>
<div class="left"><ons-back-button>戻る</ons-back-button></div>
<div class="center"><img src="./images/logoWhite.png"></div>
<div class="right"><span (click)="pushToWaitingPay()" class="right_span">到着</span></div>
</ons-toolbar>
<div class="content">
<ons-carousel #carousel fullscreen swipeable auto-scroll overscrollable direction="horizontal" id="carousel">
<ons-carousel-item>
<div id="chat">
something...
</div>
</ons-carousel-item>
<ons-carousel-cover>
<div class="slickStatus">
<p (click)="prev()">チャット</p>
<p (click)="next()">詳細</p>
</div>
</ons-carousel-cover>
<ons-bottom-toolbar>
<button type="submit" form="therapistForm" class="normal btn" width="100%" id="foot">次へ</button>
</ons-bottom-toolbar>
<ons-carousel-item #detail>
<div id="detail">
something...
</div>
</ons-carousel-item>
</ons-carousel>
</div>
`,
})
and this is my class.
export class OfferDetailComponent implements OnInit{
@ViewChild('carousel') carousel;
constructor(private _navigator: OnsNavigator) {
}
ngOnInit(){
}
prev() {
this.carousel.nativeElement.prev();
}
next() {
this.carousel.nativeElement.next();
}
pushToWaitingPay() {
this._navigator.element.pushPage(WaitingPay, {animation: 'slide', data: {aaa: 'bbb'}});
}
}
I have not done anything yet.