为什么我在带有 angularAMD 的模块中找不到 'angular'?

Why I can't find 'angular' in in a module with angularAMD?

我正在使用 AngularAMD,我正在尝试 "load" angular.easypichart 模块。

这是我的架构:

--js
----app.js
----main.js
--lib
----angular.easypiechart.js
----ngload.js

在我的 main.js 中,我有代码:

require.config({
    baseUrl: "js",
    paths: {
        'angular': 'https://ajax.googleapis.com/ajax/libs/angularjs/1.4.5/angular',
        'angular-route': 'https://ajax.googleapis.com/ajax/libs/angularjs/1.4.5/angular-route',
        'angularAMD': 'https://cdn.jsdelivr.net/angular.amd/0.2/angularAMD.min',
        'ngload': '../lib/ngload',
        'easypiechart': '../lib/angular.easypiechart'
    },
    shim: {
        'angularAMD': ['angular'],
        'angular-route': ['angular'],
        'ngload': ['angularAMD'],
        'easypiechart': ['angular']
    },
    deps: ['app']
});

在我的 app.js 中:

define(['angularAMD', 'angular-route', 'easypiechart'], function (angularAMD) {
    'use strict';

    var app = angular.module('guess-bg', ['ngRoute']);
    // config, etc.

    return angularAMD.bootstrap(app);
});

但是 'easypiechart' 失败了,我得到了错误 Cannot read property 'module' of undefined

我不明白,因为我在 easypiechart 的 shim 中使用了 ['angular']。

我尝试了很多东西,比如

define(['angularAMD', 'angular-route', 'ngload!easypiechart']

var app = angular.module('guess-bg', ['ngRoute', 'easypiechart']);

但不断出现错误。这对我来说非常晦涩,我什至不明白这个 'ngload' 是如何工作的。顺便说一句,我对 angular-route 没有任何问题。

无论如何,我不知道如何简单地加载这个模块,这真的很烦人......

你能告诉我我错过了什么吗?

I don't even understand how this 'ngload' works

如果您想直接在第一个 requireJS 模块中加载模块,则不需要 ngload。它主要用于您的应用程序的延迟加载模块,例如在 /some/random/route/ 中您想要使用一个 angular 模块,但只希望在此处加载它。 ngload 会成功的。

But 'easypiechart' fail and I get the error Cannot read property 'module' of undefined

在你的 app.js 中尝试删除 'use strict'; :

define(['angularAMD', 'angular-route', 'easypiechart'], function (angularAMD) {

    var app = angular.module('guess-bg', ['ngRoute', 'easypiechart']);
    // config, etc.

    return angularAMD.bootstrap(app);
});

这可能是因为您启用了 strict 模式。所以浏览器发现 angular 对象没有在 app.js 中的任何地方定义,因此你得到了 Cannot read property 'module' of undefined.

的错误

换句话说,angular 对象确实在全球范围内定义和可用。但是由于您处于严格模式,浏览器拒绝使用此类全局变量。如果你还想使用严格模式。使用 window.angular 代替:

define(['angularAMD', 'angular-route', 'easypiechart'], function (angularAMD) {
    'use strict';

    var app = window.angular.module('guess-bg', ['ngRoute', 'easypiechart']);
    // config, etc.

    return angularAMD.bootstrap(app);
});