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