Requirejs dependency not working

Question

我正在尝试在我的应用中使用angular-ladda指令。这是我main.js这是requirejs宣言文件：

requirejs.config({ 

    paths: { 
     underscore: 'lib/underscore/underscore', 
     angular: 'lib/angular/angular', 
     jquery: 'lib/jquery/dist/jquery.min', 
     'angular-route': 'lib/angular-route/angular-route', 
     'controllers': 'js/controllers', 
     'services': 'js/services', 
     'providers': 'js/providers', 
     'filters': 'js/filters', 
     'directives': 'js/directives', 
     'app': 'js/app', 
     'spin': 'lib/ladda/dist/spin.min', 
     'ladda': 'lib/ladda/js/ladda', 
     'ngLadda': 'lib/angular-ladda/src/angular-ladda' 

    }, 

    shim: { 
     underscore: { 
      exports: '_' 
     }, 
     'angular': { 
      exports: 'angular' 
     }, 
     'states': { 
      deps: ['angular'], 
      exports: 'states' 
     }, 
     'angular-route': { 
      deps: ['angular'] 
     }, 
     'ladda': { 
      deps: ['spin'], 
      exports: 'Ladda' 
     }, 
     'ngLadda': { 
      deps: ['ladda'] 
     } 
    }, 
    priority: [ 
     'angular' 
    ] 
}); 

requirejs(['angular', 
      'app', 
      'underscore', 
      'js/routes', 
      'jquery', 
      'services/services', 
      'providers/providers', 
      'directives/directives', 
      'filters/filters', 
      'controllers/controllers', 
      'ngLadda' 

      ], function (angular, app, _) { 
       angular.element(document).ready(function() { 
        angular.bootstrap(document, ['App']); 
        document.getElementsByTagName('html')[0].dataset.ngApp = 'App'; 
       }); 

      }); 

这里是ladda指令：

/**! 
* AngularJS Ladda directive 
* @author Chungsub Kim <subicura@subicura.com> 
*/ 

/* global Ladda */ 
(function() { 
    'use strict'; 

    angular.module('angular-ladda', []).directive(
    'ladda', 
    [ 
     '$compile', 
     function ($compile) { 
     return { 
      restrict: 'A', 
      link: function (scope, element, attrs) { 
      element.addClass('ladda-button'); 
      if(angular.isUndefined(element.attr('data-style'))) { 
       element.attr('data-style', 'zoom-in'); 
      } 


      var ladda = Ladda.create(element[0]); //here is were Ladda is not defined 
      $compile(angular.element(element.children()[0]).contents())(scope); 

      scope.$watch(attrs.ladda, function(loading) { 
       if(loading || angular.isNumber(loading)) { 
       if(!ladda.isLoading()) { 
        ladda.start(); 
       } 
       if(angular.isNumber(loading)) { 
        ladda.setProgress(loading); 
       } 
       } else { 
       ladda.stop(); 
       } 
      }); 
      } 
     }; 
     } 
    ] 
); 
})(); 

在指令代码（22行，其中评论）有一个​​erroe“Ladda没有定义”。
如果我将添加以下行：

var Ladda = require('ladda'); 

这一切都将正常工作，所以为什么在main.js的依赖性不这样做了吗？

你能帮我这个吗？

Answer 1

我认为对于依赖于工作，你必须定义ngLadda声明作为一个模块

define(function (require) { 
    // your ngLadda declaration here 
} 

编辑：还有另一种可能 当你看Ladda代码： https://github.com/hakimel/Ladda/blob/master/js/ladda.js

你看到Ladda被包裹在定义（）{}

// AMD module 
    else if(typeof define === 'function' && define.amd) { 
     define([ 'spin' ], factory); 
    } 

在requireJS文档它指出：

只能使用其他的“垫片”模块作为依赖于垫高的脚本，或者说有没有依赖性，并调用定义（）后，他们也创造了一个全球性的（如jQuery或AMD库lodash）。否则，如果您使用AMD模块作为shim配置模块的依赖项，则在构建之后，只有在构建中的shimmed代码执行后才能评估AMD模块，并且会发生错误。最终的解决方案是升级所有shimmed代码以具有可选的AMD define（）调用。

http://requirejs.org/docs/api.html#config-shim

所以，Ladda是AMD模块已经定义DEPS。在您的main.js把它垫片之外：

'ladda': { 
    exports: 'Ladda' 
}, 
'ngLadda': { 
    deps: ['ladda'] 
} 
shim: { 
    //your other shimmed modules 
} 

把你ngLadda的定义（功能（需要）{}）像它在原来的答案是说，但不要把任何依赖内。