0

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.

Kohei Okazaki
  • 53
  • 1
  • 5

0 Answers0