var app = angular.module('app',['ui.bootstrap'])
app.controller('getResources',['$scope',function($scope){
$scope.myInterval = 5000;
$scope.noWrapSlides = false;
$scope.active = 0;
var slides = $scope.slides = [];
var currIndex = 0;
$scope.addSlide = function() {
slides.push({
image: [
"https://webmppcapstone.blob.core.windows.net/fruitsimages/strawberries.jpg",
"https://webmppcapstone.blob.core.windows.net/fruitsimages/banana.jpg",
"https://webmppcapstone.blob.core.windows.net/fruitsimages/avocado.jpg",
"https://webmppcapstone.blob.core.windows.net/dairy-royaltyfree/wholemilk.png"
][slides.length % 4],
text: ['Nice image','Awesome photograph','That is so cool','I love that'][slides.length % 4],
id: currIndex++
});
for (var i = 0; i < 4; i++) {
$scope.addSlide();
}
}
}]);
I seem to be having trouble loading the images. Can you help me figure out what I'm doing wrong? I am attempting to add the images to the slides.image object and use them as ng-src in my html, but they are not loading at all.