OnsenUI：オリエンテーション変更でカルーセルが更新されない

Question

フルスクリーンのOnsenUIカルーセルで作業しています。問題は、私がスワイプ/カルーセルアイテムを変更してから向きを変えたり、ウィンドウのサイズを変更したりすると、うまく見えない場合です。この問題は公式のOnsenUIカルーセルの例にもあります。

これは私が、次の午前のコードです：

<ons-carousel swipeable overscrollable auto-scroll fullscreen initial-index="1" var="carousel"> 
    <ons-carousel-item style="background-color: gray;"> 
     <div class="item-label">GRAY</div> 
    </ons-carousel-item> 
    <ons-carousel-item style="background-color: #085078;"> 
     <div class="item-label">BLUE</div> 
    </ons-carousel-item> 
    <ons-carousel-item style="background-color: #373B44;"> 
     <div class="item-label">DARK</div> 
    </ons-carousel-item> 
    <ons-carousel-item style="background-color: #D38312;"> 
     <div class="item-label">ORANGE</div> 
    </ons-carousel-item> 
    <ons-carousel-cover> 
     <div class="cover-label">Swipe left or right</div> 
    </ons-carousel-cover> 
    </ons-carousel> 
</ons-page> 

ThisがOnsenUIサイトからペンです。

注：私はOnsenUIバージョン1.3.14

Answer 1

を使用しています、それが原因アイテムのサイズのキャッシュされた値に、このように振る舞うように思えます。しかし、温泉1の開発は終わっているので、これらのようなハックをするのは安全です。あなたはそれを修正するために、resizeイベントに行うために必要なのは以下の通りです：

var i = carousel._scroll/carousel._currentElementSize; 
    delete carousel._currentElementSize; 
    carousel.setActiveCarouselItemIndex(i); 

ここで修正してdemoが適用されます。

角度を使用している場合は、var="carousel"属性を使用するだけでコントローラにcarouselを使用できるようになります。

それは少しトリッキーが、不可能ではありません選択した後、角気に入らない場合：これは助け

var carousel = angular.element(document.getElementById('carousel')).data('ons-carousel'); 

希望。

また、Onsen 2に切り替えるだけで、このような問題をフレームワーク自体ですばやく修正できます。

更新：

このバグは温泉2.