可能一次在傳送帶上顯示兩張幻燈片？

Question

我剛開始學習Angular.js，我在Angular-ui中使用了Carousel控件。是否可以同時顯示兩張幻燈片而不是一張幻燈片？

我要顯示這樣的圖像 -

< image 1 image 2 > 
then 
< image 3 image 4 > 
then 
< image 5 image 6 > 

這裏是一個樣本 -

http://plnkr.co/edit/BnErmMDl8nPvXPrw3ULu?p=preview

Answer 1

您可以將這些圖像組合在一起，並ng-repeat對這些分組的圖像來代替。除了一些需要修復的造型，方法如下：

http://plnkr.co/edit/5JFeZgTup7abIsjxOeqi?p=preview

HTML：

<carousel interval="myInterval"> 
    <slide ng-repeat="slideCollection in groupedSlides" active="slide.active"> 
    <div> 
     <img ng-src="{{slideCollection.image1.image}}" style="margin:auto;">  
     <img ng-src="{{slideCollection.image2.image}}" style="margin:auto;">  
    </div> 
    </slide> 
</carousel> 

的JavaScript：

$scope.$watch('slides', function(values) { 
    var i, a = [], b; 

    for (i = 0; i < $scope.slides.length; i += 2) { 
    b = { image1: $scope.slides[i] }; 

    if ($scope.slides[i + 1]) { 
     b.image2 = $scope.slides[i + 1]; 
    } 

    a.push(b); 
    } 

    $scope.groupedSlides = a; 
}, true);