为什么在我使用angularAMD的模块中找不到“ angular”？

Question

我正在使用AngularAMD，正在尝试“加载” 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

我不明白，因为我在垫片中使用了['angular']来制作easypiechart。

我尝试了很多事情，例如

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

要么

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

但是要不断出错。 这对我来说很模糊，我什至不了解这个“ ngload”是如何工作的。 顺便说一下，我没有关于angular-route的问题。

无论如何，我不知道如何简单地加载该模块，这确实很烦人。

你能告诉我我想念的吗？

Answer 1

我什至不知道这个“ ngload”如何工作

如果要直接在第一个requireJS模块中直接加载模块，则不需要ngload 。 它主要用于应用程序的延迟加载模块，例如，在/some/random/route/您想使用角度模块，但只希望在此处加载它。 ngload可以解决问题。

但是“ easypiechart”失败，并且出现错误无法读取未定义的属性“ module”

在您的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模式。 因此浏览器发现在app.js任何地方都没有定义angular对象，因此出现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);
});