0
私はカルーセルのためにフクロウカルーセルを使用しています。私のカルーセルはここのものに非常に似ていますhttp://thebootstrapthemes.com/live/thebootstrapthemes-zenclassified/。私は同様の解決策Hereとここに来ました。次に私のコントローラーに同様の指令を追加しました。angularjsのowl-carousel問題ng-repeat
.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());
}
}
};
}]);
上記以外は上記のとおりです。最後のアイテムの高さは、以下の他のアイテムよりも増加します。
あなたは上記の最後の項目の表示を見ることができます。どうすればそれを解決し、原因は何ですか?どんな助けもありがとう。
一度に3つのアイテムを確認しましたか?それは正常に動作していますか? – Manish
@ManishSharmaリストの最後の項目がそのように表示されることがよくあります。私は3つのアイテムも試しました。 –
は私が見ることができる作業コードです。これは、動的な幅のフローカルーセル作成の問題である可能性があるためです。 – Manish