2016-09-26 3 views
0

저는 anugular js를 처음 사용하고 Image Slider와 같은 간단한 모듈에서 작업하고 있습니다.TypeError : anglejs의 completeOutstandingRequest에서 fn이 함수가 아닙니다.

이 모듈에서는 홈 페이지의 이미지 만 변경했습니다. 모든 것이 잘 작동합니다. 하지만 이제는 다음 이미지를 표시 할 때와 같은 일부 애니메이션을 사용하고자 할 때 이전 이미지는 페이드 효과로 숨길 것입니다.

애니메이션을 사용하려면 앵귤러 애니 메이트 플러그인을 사용했습니다. ;

var ps_mobile_app = angular.module('app', ['ngAnimate', 'ngRoute', 'ngCookies']); 
ps_mobile_app.directive('slider', function($timeout) { 
return { 
    restrict: 'AE', 
    replace: true, 
    scope: { 
     images: '=' 
    }, 
    link: function(scope, elem, attrs) { 
     scope.currentIndex = 0; 

     scope.next = function() { 
      scope.currentIndex < scope.images.length - 1 ? scope.currentIndex++ : scope.currentIndex = 0; 
     }; 

     scope.prev = function() { 
      scope.currentIndex > 0 ? scope.currentIndex-- : scope.currentIndex = scope.images.length - 1; 
     }; 

     scope.$watch('currentIndex', function() { 
      scope.images.forEach(function(image) { 
       image.visible = false; 
      }); 
      scope.images[scope.currentIndex].visible = true; 
     }); 

     /* Start: For Automatic slideshow*/ 

     var timer; 

     var sliderFunc = function() { 
      timer = $timeout(function() { 
       scope.next(); 
       timer = $timeout(sliderFunc, 5000); 
      }, 5000); 
     }; 

     sliderFunc(); 

     scope.$on('$destroy', function() { 
      $timeout.cancel(timer); 
     }); 

     /* End : For Automatic slideshow*/ 
    }, 
    templateUrl: 'shared/image-slider/slider.html' 
} 

}) :

TypeError: fn is not a function 
at angular.js:16299 
at completeOutstandingRequest (angular.js:4924) 
at angular.js:5312 

JS를 밀어 내 사용자 정의 이미지입니다 : 내가 m 응용 프로그램에이 플러그인을 포함하면 아래에 주어진 다음 브라우저 오류를 보여

내 이미지 슬라이더 모듈 HTML은 다음과 같습니다

나는 m 홈 페이지에서 위의 모듈을 사용하고
<div class="slider"> 
<div class="slide" ng-repeat="image in images" ng-show="image.visible"> 
    <img ng-src="{{image.src}}" /> 
</div> 
<div class="arrows"> 
    <a href="#" ng-click="prev()"> 
    <img src="shared/image-slider/img/left-arrow.png" /> 
    </a> 
    <a href="#" ng-click="next()"> 
    <img src="shared/image-slider/img/right-arrow.png" /> 
    </a> 
</div> 
</div> 

: 위의 코드 이미지 슬라이더와

<slider images="slider_images" /> 

각도 애니메이션 플러그인을 사용하지 않고 잘 작동한다. 그러나 Angular Animate에서는이 오류가 발생합니다. 약간의 분석 후에 나는 그것이 타임 아웃 기능 때문에 일어나고 있다고 생각한다.

누구든지이 문제에 대해 도움을받을 수 있습니까? 사전

답변

0

감사는 시도

var sliderFunc = function() { 
 
      timer = $timeout(function() { 
 
       scope.next; 
 
       timer = $timeout(sliderFunc, 5000); 
 
      }, 5000); 
 
     };