Eulenkarussell Ausgabe mit angularjs ng-repeat

Question

Bitte ich benutze Eulenkarussell für mein Karussell. Mein Karussell ist dem hier sehr ähnlich http://thebootstrapthemes.com/live/thebootstrapthemes-zenclassified/. Ich stieß auf eine ähnliche Lösung Here und hier. Ich fügte dann eine ähnliche Direktive in meinem Controller unten hinzu.

.directive('owlCarousel', function(){ 
    return { 
     restrict: 'E', 
     transclude: false, 
     link: function (scope) { 
      scope.initCarousel = function(element) { 
       // provide any default options you want 
       var defaultOptions = { 
        autoplay:true, 
        autoplayTimeout:2500, 
        loop:false,nav : true, 
        responsiveClass:true, 
        margin: 30, 
        responsive:{ 
         0:{items:1}, 
         767:{items:3}, 
         992:{items:4} 
        } 
       }; 
       var customOptions = scope.$eval($(element).attr('data-options')); 
       // combine the two options objects 
       for(var key in customOptions) { 
        defaultOptions[key] = customOptions[key]; 
       } 
       // init carousel 
       $(element).owlCarousel(defaultOptions); 
      }; 
     } 
    }; 
}).directive('owlCarouselItem', [function() { 
    return { 
     restrict: 'A', 
     transclude: false, 
     link: function(scope, element) { 
      // wait for the last item in the ng-repeat then call init 
      if(scope.$last) { 
       scope.initCarousel(element.parent()); 
      } 
     } 
    }; 
}]); 

Das obige funktioniert für mich außer. Die Höhe des letzten Gegenstandes steigt über die anderen Gegenstände hinaus.

Sie können die letzte Postenanzeige oben sehen. Bitte wie lösche ich das und was ist die Ursache? Jede Hilfe wäre willkommen.

Answer 1

Versuchen Sie, diese

.directive('owlCarousel', function(){ 
    return { 
     restrict: 'EA', 
     transclude: false, 
     link: function (scope, element, attrs) { 
      scope.initCarousel = function() { 
       // provide any default options you want 
       var defaultOptions = { 
        autoplay:true, 
        autoplayTimeout:2500, 
        loop:false,nav : true, 
        responsiveClass:true, 
        margin: 30, 
        responsive:{ 
         0:{items:1}, 
         767:{items:3}, 
         992:{items:4} 
        } 
       }; 
       $(element).owlCarousel(defaultOptions); 
      }; 
     } 
    }; 
}).directive('owlCarouselItem',[function() { 
    return function(scope) { 
    if (scope.$last) { 
     scope.initCarousel(); 
    } 
    }; 
    }]); 

auf diese Frage finden Sie hier Sein, was für mich gearbeitet.