私は Angular2 と onsenUI2 で ons-carousel を使用しています。
カルーセルの変化を検出したい。
postchange で使用できるかもしれませんが、postchange の使用方法がわかりません。
これは私のコンポーネントです
@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>
`,
})
これが私のクラスです。
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'}});
}
}
私はまだ何もしていません。