我正在与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']);
但不断收到错误。这对我来说非常不利,我甚至都不明白这是怎么回事#'作品。顺便说一句,我对angular-route
没有任何问题。
无论如何,我不知道如何简单地加载这个模块,它真的很烦人......
你能告诉我我错过了什么吗?
答案 0 :(得分:0)
我甚至不了解'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
模式。因此,浏览器发现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);
});