Модуль angularGrid недоступен! с ag-сеткой и HotTowel

Я немного новичок в AngularJS и наборе инструментов HotTowel. Нижняя установка ag-grid размещает соответствующие (.css & .js) ссылки в файле index.html. Была предпринята попытка зависимости от angularGrid для различных модулей (например, приложения, ядра и т. Д.), Но безуспешно. Выдержки из кода включены ниже.

Во время выполнения это приводит к строке ошибок:

[$ injector:modulerr] Не удалось создать экземпляр приложения модуля из-за:

Ошибка: [$injector:modulerr] Не удалось создать экземпляр модуля app.core из-за:

Ошибка: [$ инжектор:modulerr] Не удалось создать экземпляр модуля angularGrid из-за:

Ошибка: [$ инжектор: номод] Модуль 'angularGrid' недоступен! Вы либо неправильно написали имя модуля, либо забыли загрузить его. При регистрации модуля убедитесь, что вы указали зависимости в качестве второго аргумента.

так далее..,

Я вижу, что сценарий ag-grid и файлы таблиц стилей действительно включены во время выполнения в отладчик инструментов браузера; но ошибка (я думаю) говорит мне, что модуль сетки не может быть найден при попытке загрузить app.core - где я в настоящее время указал зависимость.

Интересно, что эти ошибки исчезнут в проекте HotTowel, если я удаляю запись зависимости ag-grid из bower.json (вручную связывая связанные ссылки.css в index.html) и копирую файл angular-grid.js ag-grid в структура клиентского приложения (например, в основной папке). Этот подход поднимает другие вопросы и проблемы, хотя.

Кроме того, ag-grid работает "как рекламируется" (то есть из каталога bower) на моей машине в простых проектах AngularJS (вне среды HotTowel).

Есть ли где-нибудь простой проект HotTowel, который использует ag-grid? Или вы можете дать совет, как правильно решить эту проблему?


Выдержки из проекта 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 -->
     


На заднем плане - как быстрый путь к "успешной сборке релиза" (т.е. сборке gulp в HotTowel) - я временно (пока не могу понять, как обратиться к конфигурации Karma для поддержки ag-grid), изменил файл 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();
}

1 ответ

Решение

Это известная проблема с угловой сеткой и wiredep или автоматическим инжектором. Угловая сетка не зависит от угловой, она может работать нативно.

Итак, если вы используете wiredep, используйте переопределения, чтобы angular-grid зависела от angular. или вручную включить угловой перед угловой сеткой

<script src="/bower_components/ag-grid/dist/angular-grid.js"></script>
<script src="/bower_components/angular/angular.js"></script>

в

<script src="/bower_components/angular/angular.js"></script>
<script src="/bower_components/ag-grid/dist/angular-grid.js"></script>
Другие вопросы по тегам