Directive for initializing Owl Carousel in AngularJS ng-repeat
#Download ##NPM
npm install ng-repeat-owl-carousel --save
##Bower
bower install ng-repeat-owl-carousel --save
#Usage Add source file to your view
<script src="ngRepeatOwlCarousel.min.js"></script>
Add module as dependency to your app
angular.module('app', ['ocNgRepeat'])
Create Owl Carousel initializer method on controller or page
app.controller("TeamController", [ function() {
var ctrl;
ctrl = this;
ctrl.members = []
ctrl.carouselInitializer = function() {
$(".about-carousel").owlCarousel({
items: 3,
navigation: true,
pagination: false,
navigationText: ["<i class='fa fa-angle-left'></i>", "<i class='fa fa-angle-right'></i>"]
});
};
}
]);
Add directive to your view and pass carousel initializer method
<div ng-controller="TeamController as tCtrl">
<div ng-repeat="mbr in tCtrl.members" ng-repeat-owl-carousel carousel-init="tCtrl.carouselInitializer">
</div>
</div>