與延遲加載引導滑塊angularjs

Question

我想添加到引導輪轉延遲加載，如下面的例子：

example

<img data-lazy-load-src= 

但我用NG-SRC獲得滑塊IMGS（angularjs）

如何我可以處理這個例子與延遲加載

Answer 1

具有角引導滑塊工作試圖我提出個後是邏輯

的Html

<div ng-app='App' ng-controller='test' ng-init='imgSliderIndex =0'> 
    <button id='more' ng-click="imgSliderIndex = check(imgSliderIndex + 1);"> more</button> 
    <img ng-src='{{imges[imgSliderIndex].path}}'> 
</div> 

Angularjs：

var app = angular.module('App',[]); 

app.controller('test', ['$scope', function($scope) { 
    $scope.imges = [ 
    { 
     name: "Image 1", 
     path: "http://demo.averta.net/themes/lotus/agency/wp-content/uploads/2012/10/slider8.jpg" 
    }, 
    { 
     name: "Image 2", 
     path: "http://demo.smartaddons.com/extensions/joomla17/cache/mod_sj_content_slider/cc021ca251f443c4a934cba184872eff.jpeg" 
    }, 
    { 
     name: "Image 3", 
     path: "http://demo.averta.net/themes/lotus/agency/wp-content/uploads/2012/10/slider10.jpg" 
    } 
]; 

$scope.check = function(value) { 
    if ($scope.imges.length > value) { 
     return value; 
    }else{ 
     return 0 ; 
    } 
} 
}]); 

Answer 2

您可以使用NG-SRC的IMG，顯示達到該幻燈片只有當網址，例如：

<img ng-src="{{$index == carouselActive && 'http://www.google.com/image.jpg' || ''}}"/> 

其中$指數是當前幻燈片和carouselActive正在顯示的幻燈片。