Как использовать тег ng-repeat в слайдерах jssor

Я новичок в угловых js и javascript. Мне нужно интегрировать jssor в свой проект. Для этого я пытаюсь использовать массив ползунков, но ng-repaet, похоже, не работает в jssor, он показывает «неопределенную ошибку». Не могли бы вы мне помочь?Как использовать тег ng-repeat в слайдерах jssor

<div ng-repeat="slide in slides"> 
    <img u="image" ng-hide="!isCurrentSlideIndex($index)"ng-src="{{slide.img}}" /> 
</div> 

$scope.slides = [ 
        { 
         img : 'https://careersites.s3-us-west-2.amazonaws.com/cmr/6.jpg', 
         thumb: 'http://www.vougageste.com/images/cartazes/1b94e20c15b26e99928401088da4a0bc.jpg' 
        }, 
        { 
         img : 'https://careersites.s3-us-west-2.amazonaws.com/cmr/6.jpg', 
         thumb: 'https://diretodasaladeestar.files.wordpress.com/2011/07/encomenda.jpg' 
        }, 
        { 
         img : 'https://careersites.s3-us-west-2.amazonaws.com/cmr/6.jpg', 
         thumb: 'http://comofas.com/wp-content/uploads/2012/08/encomendas.jpg', 
        } 
       ]; 
    $scope. currentIndex=0; 
    $scope.isCurrentSlideIndex = function (index) { 
       return $scope.currentIndex === index; 
      };

}

источник

2016-09-02 Raju

Вы включили массив слайдов в угловом $ scope? –

Да, это мой массив слайдов – Raju

Можете ли вы добавить функцию 'isCurrentSlideIndex' в код, пожалуйста, –

Ну главная проблема с вашим кодом, что вы не установили ng-src правильно, вы установите его с slide.image в то время как это slide.img

<!DOCTYPE html> 
<html> 

    <head> 
    <script data-require="[email protected]" data-semver="1.5.8" src="https://opensource.keycdn.com/angularjs/1.5.8/angular.min.js"></script> 
    <link rel="stylesheet" href="style.css" /> 
    <script> 
     var app = angular.module('yourApp', []); 
     app.controller('YourCtrl', function($scope) { 
     $scope.slides = [ 
      { 
      img : 'https://careersites.s3-us-west-2.amazonaws.com/cmr/6.jpg', 
      thumb: 'http://www.vougageste.com/images/cartazes/1b94e20c15b26e99928401088da4a0bc.jpg' 
      }, 
      { 
      img : 'https://careersites.s3-us-west-2.amazonaws.com/cmr/6.jpg', 
      thumb: 'https://diretodasaladeestar.files.wordpress.com/2011/07/encomenda.jpg' 
      }, 
      { 
      img : 'https://careersites.s3-us-west-2.amazonaws.com/cmr/6.jpg', 
      thumb: 'http://comofas.com/wp-content/uploads/2012/08/encomendas.jpg', 
      } 
     ]; 
     $scope.isCurrentSlideIndex = function(idx) { 
      if(idx === 1) return true; 
      return false; 
     }; 
     }); 
    </script> 
    </head> 

    <body ng-app="yourApp"> 
    <div ng-controller="YourCtrl"> 
     <div ng-repeat="slide in slides"> 
     <img u="image" ng-hide="!isCurrentSlideIndex($index)" ng-src="{{slide.img}}" /> 
     </div> 
    </div> 
    </body> 

</html>

Все остальное должно работать хорошо Вот plunker

источник

2016-09-02 14:36:06

жаль, что это не сработало для меня, в plunker также мы получаем только одно изображение, изображения не повторяются, пока я пытаюсь это сделать я получал эту ошибку Ошибка: после не определено $ AnimateProvider Raju

Точно, где вы используете $ AnimateProvider, можете ли вы объяснить немного больше или изменить свой вопрос, пожалуйста –

Как использовать тег ng-repeat в слайдерах jssor

ответ

Смежные вопросы