0

私は 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'}});
 }
}

私はまだ何もしていません。

4

0 に答える 0