'use strict'; angular.module('app').directive('swipersLbt',swipers); swipers.$inject = ['$timeout']; function swipers($timeout) { return { restrict: "EA", scope: { data:"=" }, template: '<div class="swiper-container silder">'+ '<div class="swiper-wrapper">'+ '<div class="swiper-slide" ng-repeat="item in data">'+ '<a class="" href="{{item.openurl}}"><img ng-src="{{item.imgurl}}" alt="{{item.alt}}" /><span ng-show="item.recom">{{item.recom}}</span></a>'+ '</div>'+ '</div>'+ '<div class="swiper-pagination"></div>'+ '</div>', link: function(scope, element, attrs) { $timeout(function(){ var swiper = new Swiper('.swiper-container', { loop: true, autoplay: { delay: 2500, disableOnInteraction: false, }, pagination: { el: '.swiper-pagination', clickable: true } }); },100); } }; }
调用:<swipers-lbt data="lbts"></swipers-lbt>
lbts:
$scope.lbts=[ { imgurl:'image/banner_0.jpg', alt:'第1张alt', openurl:"https://www.baidu.com", recom:"推 荐" },{ imgurl:'image/banner_1.jpg', alt:'第2张alt', openurl:"https://www.baidu.com", recom:"" } ];