图像滑块的角度 js 超时

Angular js timeout for image slider

本文关键字:js 超时 图像      更新时间:2023-09-26

您好,我正在尝试让我的 Angular js 图像滑块从幻灯片到幻灯片作为幻灯片放映,我确实为下一个和上一个图像编写了部分,但是当我尝试对其进行编码以自动工作时,它不起作用。 我真的不知道为什么?。

我用了 : $timeout 我设置了一个带有时间的 var,然后将代码的下一部分放入一个函数中并调用它,但它不是那样工作的:

function nextSlide(){
         $scope.direction = 'right';
            $scope.currentIndex = ($scope.currentIndex > 0) ? --$scope.currentIndex : $scope.slides.length - 1;
        $timeout($scope.nextSlide);
    }

然后我在我的控制器中像这样调用它:

   var TimeToSlide = 3000;
 $timeout(nextSlide, TimeToSlide);

我每 3 秒工作一次

在我的控制器中,我使用了该服务

.controller('MyCtrl', function ($scope, $timeout) { // here i put my code }

这是我的小提琴,如果有人可以指导我该怎么做.

http://jsfiddle.net/heshamelmasry/HB7LU/22863/

在你的小提琴中,你没有在你的控制器中包含$timeout。$timeout仅在下一个幻灯片函数中。按钮似乎混淆了。右键是上一个按钮,左按钮是下一个按钮。因为在我解决这些问题后,代码本身似乎可以正常工作。

http://jsfiddle.net/b15nrbpk/

$scope.prevSlide = function () {
    $scope.direction = 'left';
        $scope.currentIndex = ($scope.currentIndex < $scope.slides.length - 1) ? ++$scope.currentIndex : 0;
        $timeout($scope.prevSlide, 3000);
    };

$scope.nextSlide = function () {
        $scope.direction = 'right';
        $scope.currentIndex = ($scope.currentIndex > 0) ? --$scope.currentIndex : $scope.slides.length - 1;
        $timeout($scope.nextSlide, 3000);
    };

更新

您可以简单地致电

 //Start the slideshow
 $scope.nextSlide();

在您的控制器中。但调用必须在控制器中。查看此更新的小提琴