我对 AngularJS 和 HotTowel 工具链有些陌生。ag-grid的凉亭安装在 index.html 文件中放置了适当的(.css 和 .js)链接。已尝试针对不同的模块(例如应用程序、核心等)依赖于“angularGrid”,但没有成功。代码摘录如下。
在运行时,这会导致一串错误:
[$injector:modulerr] 无法实例化模块应用程序,原因是:
错误:[$injector:modulerr] 无法实例化模块 app.core,原因如下:
错误:[$injector:modulerr] 无法实例化模块 angularGrid,原因是:
错误:[$injector:nomod]模块“angularGrid”不可用!您要么拼错了模块名称,要么忘记加载它。如果注册模块,请确保将依赖项指定为第二个参数。
ETC。 。.
我可以看到 ag-grid 脚本和样式表文件确实在运行时包含在浏览器工具调试器中;但错误是(我认为)告诉我在尝试加载 app.core 时找不到网格模块 - 我目前已经在其中声明了依赖项。
有趣的是,如果我从 bower.json 中删除 ag-grid 依赖项(手动链接 index.html 中的关联 .css 链接)并将 ag-grid 的“angular-grid.js”文件复制到客户端应用程序结构(例如,在核心文件夹下)。但是,这种方法引发了其他问题和担忧。
此外,在我的机器上的简单 AngularJS 项目(在 HotTowel 环境之外)中,ag-grid 确实“像宣传的那样”(即,从其凉亭目录)工作。
是否有一个使用 ag-grid 的简单 HotTowel 项目?或者您能否就如何正确解决这种情况提供建议?
HotTowel 项目的节选。. .
来自 core.module.js:
(function () {
'use strict';
angular
.module('app.core', [
'ngAnimate', 'ngSanitize',
'blocks.exception', 'blocks.logger', 'blocks.router',
'angularGrid',
'ui.router',
'ngplus'
]);
})();
来自 index.html:
<!-- bower:css -->
<link rel="stylesheet" href="/bower_components/ag-grid/dist/angular-grid.css" />
<link rel="stylesheet" href="/bower_components/ag-grid/dist/theme-fresh.css" />
<link rel="stylesheet" href="/bower_components/ag-grid/dist/theme-dark.css" />
<link rel="stylesheet" href="/bower_components/bootstrap/dist/css/bootstrap.css" />
<link rel="stylesheet" href="/bower_components/font-awesome/css/font-awesome.css" />
<link rel="stylesheet" href="/bower_components/toastr/toastr.css" />
<!-- endbower -->
<!-- bower:js -->
<script src="/bower_components/jquery/dist/jquery.js"></script>
<script src="/bower_components/ag-grid/dist/angular-grid.js"></script>
<script src="/bower_components/angular/angular.js"></script>
<script src="/bower_components/angular-animate/angular-animate.js"></script>
<script src="/bower_components/angular-sanitize/angular-sanitize.js"></script>
<script src="/bower_components/angular-ui-router/release/angular-ui-router.js"></script>
<script src="/bower_components/extras.angular.plus/ngplus-overlay.js"></script>
<script src="/bower_components/moment/moment.js"></script>
<script src="/bower_components/toastr/toastr.js"></script>
<!-- endbower -->
在后台 - 作为“成功发布构建”的快速路径(即,HotTowel 中的 gulp 构建) - 我暂时(直到我能弄清楚如何解决 Karma 配置以支持 ag-grid)修改了 John Papa 的 gulp 文件:
gulp.task('test', ['vet', 'templatecache'], function (done) {
//startTests(true /*singleRun*/ , done);
badKarma(true /*phantomjs1xIssue*/ , done);
});
gulp.task('autotest', function(done) {
//startTests(false /*singleRun*/ , done);
badKarma(true /*phantomjs1xIssue*/ , done);
});
/**
* Can't use Angular Grid with Phantomjs 1.9.x.
* The problem is supposed to be fixed in Phantomjs 2.0. - not yet supported in npm or VS2015.
* See: http://angulargrid.com/forum/showthread.php?tid=2516&highlight=stopDragging
*/
function badKarma(phantomjs1xIssue, done) {
done();
}