使用AngularJS指令的Cycle2滑块

时间:2014-12-09 22:23:10

标签: javascript angularjs jquery-cycle2

我需要帮助来创建一个使用指令的cycle2幻灯片。我发现这个代码在互联网上被复制到我的本地机器上进行测试,但它似乎根本不起作用。

我收到此错误:

 Uncaught ReferenceError: angular is not defined slide.js:1
 Uncaught Error: [$injector:modulerr] http://errors.angularjs.org/1.2.14/$injector/modulerr?p0=myApp&p1=Error%3A%…gleapis.com%2Fajax%2Flibs%2Fangularjs%2F1.2.14%2Fangular.min.js%3A17%3A431) angular.js:36
 GET https://cdnjs.cloudflare.com/ajax/libs/jquery.cycle2/20140216/jquery.cycle2.js.map 404 (Not Found) cdnjs.cloudflare.com/ajax/libs/jquery.cycle2/20140216/jquery.cycle2.js.map:1

这是代码:http://codepen.io/funkybudda/pen/oACkf

谢谢。

1 个答案:

答案 0 :(得分:0)

如果你有一小部分重复项目样本,那么这个例子就可以了,但是超时是一个黑客攻击。如果你有一个更大的设置,循环插件将无法工作,除非有子项目,所以你需要在ng-repeat完成后启动插件。我推荐这样的指令用于子项目。

app.directive('jquerySliderSlide', function(){
  return{
    restrict: 'A',
    link: function(scope, element, attrs){ 
        scope.$watch('$last', function(v){
            if(v){
                //initiate the plugin on the parent
                element.parent().cycle();
            }
        });
    }
  }
});