Question

我尝试加载一个依赖于'restangular'的模块。但是如果我尝试在加载的模块配置中使用'RestangularProvider'，它会给出以下错误：

Uncaught Error: [$injector:unpr] Unknown provider: RestangularProviderProvider <- RestangularProvider

这是“主”模块，在匹配路由“/ app”时动态加载其他模块：

define(['angularAMD', 'angularUiRouter', 'restangular'], function (angularAMD) {
var module = angular.module(
    'Index', [
        'ui.router',
        'restangular'
    ])
    .config([
        '$stateProvider', '$urlRouterProvider', 'RestangularProvider',
        function ($stateProvider, $urlRouterProvider, RestangularProvider) {
            $urlRouterProvider.otherwise("/app");
            $stateProvider
                .state('app', angularAMD.route({
                    url: '/app',
                    templateUrl: 'app/app.html',
                    controller: 'AppController',
                    controllerUrl: 'ngload!app'
                }));
            RestangularProvider.setRequestSuffix('.json');
        }])
    .run([
        function run() {
        }])
    .controller(
    'IndexController',
    [
        '$scope', '$rootScope', '$location',
        function controller($scope, $rootScope, $location) {
        }
    ]);
angularAMD.bootstrap(module);
return module;
});

这是加载的app模块：

define([], function () {
var module = angular.module(
    'App', [
        'ui.router',
        'restangular'
    ])
    .config([
        'RestangularProvider',
        function (RestangularProvider) {
        }])
    .controller(
        'AppController',
        [
            '$scope', '$rootScope', '$location',
            function controller($scope, $rootScope, $location) {
                $scope.message = "App";
            }
        ]);
return module;
});

如果配置中没有'RestangularProvider'，应用程序就可以正常工作。

但是使用'RestangularProvider'或我测试过的任何其他提供商都没有。

似乎AngularAMD加载的模块不可能有任何其他依赖项。

要清楚，模块会加载，但依赖项似乎在加载的模块配置中不可用。

我该怎么办？

PS：这是requirejs config：

require.config({
baseUrl: "",
paths: {
    'lodash': 'Vendor/lodash/lodash',
    'jquery': 'Vendor/jquery/jquery-1.10.2',
    'angular': 'Vendor/angular/angular-1.2.3',
    'angularAMD': 'Vendor/angular-amd/angularAMD',
    'angularRoute': 'Vendor/angular/angular-route',
    'angularUiRouter': 'Vendor/angular-ui-router/angular-ui-router',
    'ngload': 'Vendor/angular-amd/ngload',
    'restangular': 'Vendor/restangular/restangular',
    'app': 'app/app'
},
shim: {
    'angular': ['jquery'],
    'angularAMD': ['angular'],
    'ngload': ['angularAMD'],
    'angularRoute': ['angular'],
    'angularUiRouter': ['angular'],
    'restangular': ['angular', 'lodash'],
    'app': ['angularUiRouter', 'restangular']
},
deps: ['Index']

}）;

Answer 1

在配置/代码中有一些看起来不正确的事情：

您的“主要”模块应该是“app.js”模块。
我不清楚你的“app”模块正在做什么。 restangular的配置应该在适当的“app.js”模块中进行。
在“requirejs config”中，您引用的deps: ['Index']实际上并不存在。您应该改为引用“app.js”模块。

这是一个工作的plunker演示如何使用angularAMD lozay加载Restangular： http://plnkr.co/edit/zXRuFwoncXZux1TgVUCM?p=preview

Answer 2

我最近遇到过类似的问题。对我来说最有效的是包括＆＃34;出口＆＃34;在垫片中，而不仅仅是＆＃34; deps＆＃34;。当你包含＆＃34;出口＆＃34; （无论定义的deps数量是多少），requirejs都会确保为该模块加载了这些依赖项。这有意义吗？

require.config({
    baseUrl: "",
    paths: {
        'lodash': 'Vendor/lodash/lodash',
        'jquery': 'Vendor/jquery/jquery-1.10.2',
        'angular': 'Vendor/angular/angular-1.2.3',
        'angularAMD': 'Vendor/angular-amd/angularAMD',
        'angularRoute': 'Vendor/angular/angular-route',
        'angularUiRouter': 'Vendor/angular-ui-router/angular-ui-router',
        'ngload': 'Vendor/angular-amd/ngload',
        'restangular': 'Vendor/restangular/restangular',
        'app': 'app/app'
    },
    shim: {
        'angular': {
            deps: ['jquery'],
            exports: 'angular'
        },
        'angularAMD': {
            deps: ['angular'],
            exports: 'angularAMD'
        },
        'ngload': {
            deps: ['angular'],
            exports: 'ngload'
        },
        'angularRoute':{
            deps: ['angular'],
            exports: 'angularRoute'
        },
        'angularUiRouter': 
            deps: ['angular'],
            exports: 'angularUiRouter'
        },
        'restangular': {
            deps: ['angular','lodash'],
            exports: 'restangular'
        },
        'app': {
            deps: ['angular','angularAMD','angularUiRouter', 'restangular'],
            exports: 'app'
        }
    },
    deps: ['app']
});

我对＆＃34;索引＆＃34;是为什么你定义了两个类似的模块;第一个就足够了。您只需要将app.js作为require config中的主要deps。这基本上告诉requirejs立即使该模块可用。请仔细阅读http://requirejs.org/docs/api.html#config-shim

AngularAMD无法加载具有依赖关系的模块？

2 个答案: