第三方AngularJS模块

Question

在我的项目中，我希望延迟加载的模块可以添加自己的状态，所以我找到了ui-router-extras。它对我来说真的很有用，但是当我想在延迟加载的模块中使用ng-grid时，比如demo1中的module1，module1.js文件看起来像这样：

 define(['angularAMD', 'ngGrid'], function () {

     var app = angular.module("module1", ['ui.router','ngGrid']);

     ...

，main.js文件如下所示：

require.config({
  waitSeconds: 100,
  paths: {
    "angularAMD": "../../lib/angularAMD",
    ...
    "jQuery": "../../lib/jquery",
    "ngGrid": "../../lib/ng-grid-2.0.14.debug"
  },
  shim: {
    "angular": { exports: "angular" },
    ...
    "ngGrid": ["angular", "jQuery"],
  },
  deps: ["app"]
});

但是我从ng-grid得到了一个例外：＆＃34; Uncaught TypeError：无法读取属性＆＃39; factory＆＃39;未定义＆＃34;。我找到了发生异常的ng-grid源代码：

angular.module('ngGrid.services').factory('$domUtilityService',['$utilityService', '$window', function($utils, $window) {....}

所以我在延迟加载的模块中找到了由angular.module获取模块（＆＃39; mymodule＆＃39;）返回undefined。有没有我忘记写的东西，或者是否有另外一种方法在延迟加载模块中使用ng-grid或其他插件与ui-router-extras的未来？

Answer 1

您需要使用＆＃39; ngload＆＃39; AngularAMD的插件可以动态加载模块。

摘自文档：

第三方AngularJS模块

第三方AngularJS模块，意味着使用angular.module语法创建的任何模块，可以在调用angularAMD.bootstrap之前作为任何普通JavaScript文件加载。引导后，必须使用附带的ngload RequireJS插件加载任何AngularJS模块。

define(['app', 'ngload!dataServices'], function (app) {...});

如果您需要使用RequireJS插件加载模块，或者您有复杂的依赖关系，可以创建一个包装器RequireJS模块，如下所示：

define(['angularAMD', 'ui-bootstrap'], function (angularAMD) {
    angularAMD.processQueue();
});

在这种情况下，所有依赖项都将排队，当调用.processQueue（）时，它将通过队列并使用app.register将它们复制到当前应用程序中：

https://github.com/marcoslin/angularAMD

在ui-router-extras演示中，我想在module1中使用ng-grid，但是它没有工作

1 个答案:

第三方AngularJS模块