javascript - Slider in Angular.js -


what trying make slider following goal:

the pictures randomly pulled database , reload after interval without refreshing page.

so far slider.js looks this:

(function () { 'use strict';  var controllerid = 'sliderctrl';    angular.module('app').controller(controllerid, ['$scope', 'common', 'config','datacontext','$interval', sliderctrl]);  function sliderctrl($scope, common, config, datacontext,$interval) {     var getlogfn = common.logger.getlogfn;     var log = getlogfn(controllerid);     var logerror = getlogfn(controllerid, 'error');     var logsuccess = getlogfn(controllerid, 'success');     var numberofdeals = 1;     var vm = this;        vm.myinterval = 3000;     vm.slides = [];     vm.addslide = addslide;     vm.imagespinneroptions = {         radius: 10,         lines: 5,         length: 0,         width: 8,         speed: 1.7,         corners: 1.0,         trail: 100,         color: 'black'     };     vm.companyname = config.companysettings.companyname;     vm.isimagebusy = new array(numberofdeals);     vm.toggleimagespinner = toggleimagespinner;      activate();       function activate() {         resetimagespinners();         var promises = [getcardeals()];         common.activatecontroller(promises, controllerid)             .then(function() {                 $.each(vm.randomcars, function(index, value) {                     vm.addslide(value);                 });                 log('activated home view');                 window.prerenderready = true;             });     }       function resetimagespinners() {         (var = 0; < numberofdeals; i++) {             toggleimagespinner(true, i);         }     }      function toggleimagespinner(on, index) { vm.isimagebusy[index] = on; }       function addslide(car) {          if (vm.slides.length < numberofdeals) {             vm.slides.push({                   image: '{servicename}/image?cid={companyid}&sid={stockid}&no=0'.                 format({                     servicename: config.remoteservicename,                     companyid: car.companyid,                     stockid: car.stockid                 }),                 text: '{make} {model} ({year})'.                 format({                     make: car.make,                     model: car.variant,                     year: car.year                 }),                 price: (car.sellingprice || ''),                 carid: car.stockid,                 companyid: car.companyid,                 make: car.make,                 description: car.description,          });           }     };        function getcardeals() {         return datacontext.deal.getall().then(function (data) {             return vm.randomcars = data;         });     }  }   })(); 

and slider.html:

<div data-ng-controller="sliderctrl vm"> <style>     .slider {         margin-top: 1em;     }      .slider-box img {         width: 100%;     }      .slider-box {         width: 960px;         margin: 0 auto;         heigth:304px;     } </style> <div class="slider-box" data-ng-repeat="slide in vm.slides">     <a data-ng-href="/vehicles/details/{{slide.companyid}}/{{slide.carid}}">         <img data-ng-src="{{slide.image}}" data-imageonload="{{$index}}">     </a> </div> </div> 

it makes 1 car picture if want see 1 have reload page.


Comments

Popular posts from this blog

sql - invalid in the select list because it is not contained in either an aggregate function -

Angularjs unit testing - ng-disabled not working when adding text to textarea -

How to start daemon on android by adb -