Angular-Karussell wird nicht immer auf Dias geändert.

Question

Ich bin neu bei AngularJS und würde mich über Ihren Ratschlag freuen. ich den Slider mit Bildern haben:

<ul rn-carousel rn-carousel-index="carouselIndex" rn-carousel-buffered> 
      <li ng-repeat="slide in slides track by slide.id" ng-class="'id-' + slide.id"> 
       <div ng-style="{'background-image': 'url(' + slide.image + ')'}" class="bgimage"> 
       </div> 
      </li> 
     </ul> 

In meinem Controller ich $scope.slides einige Array von Bildern zuordnen:

$scope.slides = []; 
$.each(defaultImages,function(i, element) 
     { 
      var slide = { 
      image://... 
      }; 
      $scope.slides.push(slide); 
     }); 

Auch habe ich eine Funktion, die Dias Array ändert:

$scope.colorClicked = function ($index, color_id) { 
    //... 
    $scope.slides = []; 
    $.each(images,function(i, element) 
     { 
      var slide = { 
      image:/... 
      }; 
      $scope.slides.push(slide); 
     }); 
    } 

Ich habe die zwei Ausgaben:

1) Es funktioniert f In einigen Fällen ändert sich das Bild, das derzeit auf dem Schieberegler angezeigt wird, nicht, wenn die Funktionausgelöst wird.

Ich frage mich, ob ich irgendwie den Schieberegler oder das Oszilloskop aktualisieren soll? Ich habe versucht, $scope.$apply() in meiner Funktion, aber es hat nicht geholfen.

2) Auch wenn ich Array an die Folien-Sammlung übergeben, bekomme ich trotzdem Fehler in meiner Konsole: Error: the slides collection must be an Array obwohl mein Slider funktioniert gut.

Answer 1

soluction Fehler 'Fehler: die Dias Sammlung muss ein Array an Fehler sein (nativ) Winkel carousel.min.js: 8'

//Controller 
$scope.banners = []; 

Banners.getListBanners().then(function (banners) { 
    $scope.banners = banners; 
}); 

//view 

<ul rn-carousel rn-carousel-auto-slide rn-carousel-transition="slide" ng-show="banners.length > 0"> 
      <li ng-repeat="banner in banners"> 
       <p ng-bind-html="banner.title | to_trusted"></p> 

       <img ng-if="isBlank(banner.link)" ng-src="{{banner.img}}" alt="{{banner.title | to_trusted}}"> 

       <a ng-if="!isBlank(banner.link)" ng-click="openInExternalBrowser(banner.link, banner.type)" href="#"> 
        <img ng-src="{{banner.img}}" alt="{{banner.title | to_trusted}}"> 
       </a> 

      </li> 
     </ul>