无法在依赖项中加载agGrid

时间:2016-05-24 20:38:53

标签: javascript jquery angularjs ag-grid

我试图在我的角度项目中加载agGrid,但我无法弄清楚我在实施中做错了什么..我得到的错误是 错误:[$ injector:nomod]模块' ag.grid'不可用! 下面是我用来在我的项目中获取agGrid的脚本和依赖项。



  <link rel="stylesheet" type="text/css" href="bower_components/toastr/toastr.min.css"/>
    <link rel="stylesheet" type="text/css" href="bower_components/bootstrap/dist/css/bootstrap.min.css"/>
    <link rel="stylesheet" type="text/css" href="bower_components/angular-ui-select/dist/select.min.css">
    <link rel="stylesheet" type="text/css" href="bower_components/font-awesome/css/font-awesome.min.css">
    <link rel="stylesheet" type="text/css" href="bower_components/angular-loading-bar/build/loading-bar.min.css">
    <link rel="stylesheet" type="text/css" href="bower_components/nvd3/build/nv.d3.min.css">
    <link rel="stylesheet" type="text/css" href="bower_components/ng-prettyjson/dist/ng-prettyjson.min.css">
    <link rel="stylesheet" type="text/css" href="bower_components/ng-table/dist/ng-table.min.css">
    <link rel="stylesheet" type="text/css" href="bower_components/angular-ui-grid/ui-grid.min.css">
    <link rel="stylesheet" type="text/css" href="bower_components/ag-grid/dist/styles/ag-grid.css">
&#13;
&#13;
&#13;

&#13;
&#13;
define([
    'pages/transfer/grid/transfer-grid',
    'pages/reports/reports/reports-config'

    ], function () {
        var module = angular.module('app.pages.ePayment', [
            'app.pages.transfer.grid',
            'app.pages.reports.config',
            'ngTable',
            'agGrid'

        ]);


    module.config(['$stateProvider', function ($stateProvider) {
        $stateProvider.state('ePayment', {
            url: '/ePayment',
            views: {
                contentView: {
                    templateUrl: 'app/pages/ePayment/ePayment.html'
                }
            }
        });

    }]);
    module.run(['navigationMenuService', function (navigationMenuService) {
        navigationMenuService.addMenuItem({
            name: "ePayment",
            link: "ePayment",
            iconClass: "fa fa-money"
        })
    }]);
    
&#13;
<script>window.name = "NG_DEFER_BOOTSTRAP!";</script>
<!-- build:remove:production -->
<script src="bower_components/angular/angular.js" type="text/javascript"></script>
<script src="bower_components/angular-animate/angular-animate.min.js" type="text/javascript"></script>
<script src="bower_components/angular-bootstrap/ui-bootstrap-tpls.min.js" type="text/javascript"></script>
<!-- <script angular-cache ojt preku require.js -->
<script src="bower_components/angular-filter/dist/angular-filter.min.js" type="text/javascript"></script>
<script src="bower_components/angular-loading-bar/build/loading-bar.js" type="text/javascript"></script>
<script src="bower_components/angular-translate/angular-translate.js" type="text/javascript"></script>
<script src="bower_components/angular-ui-router/release/angular-ui-router.js"></script>
<script src="bower_components/angular-ui-select/dist/select.min.js"></script>
<script src="bower_components/angular-ui-utils/ui-utils.min.js" type="text/javascript"></script>
<script src="bower_components/ngInfiniteScroll/build/ng-infinite-scroll.min.js" type="text/javascript"></script>
<script src="bower_components/quick-ngrepeat/quick-ng-repeat.js" type="text/javascript"></script>
<script src="bower_components/angular-nvd3/dist/angular-nvd3.min.js" type="text/javascript"></script>
<script src="bower_components/ng-prettyjson/dist/ng-prettyjson.min.js" type="text/javascript"></script>
<script src="bower_components/file-saver.js/FileSaver.js" type="text/javascript"></script>
<script src="bower_components/js-xlsx/dist/xlsx.core.min.js" type="text/javascript"></script>
<script src="bower_components/alasql/dist/alasql.min.js" type="text/javascript"></script>
<script src="bower_components/ng-table/dist/ng-table.js" type="text/javascript"></script>
<script src="bower_components/angular-ui-grid/ui-grid.min.js" type="text/javascript"></script>
<script src="bower_components/ag-grid/dist/ag-grid.js" type="text/javascript"></script>
&#13;
&#13;
&#13;

我说错了还是什么?我使用凉亭安装(凉亭安装ag-grid)。

1 个答案:

答案 0 :(得分:1)

我面对ag-grid的一件事是你必须在index.html中提及它甚至在angularjs之前,而另一件事在你的主模块中你必须调用函数:

 agGrid.initialiseAgGridWithAngular1(angular);

甚至在您的模块声明之前。
请参阅https://www.ag-grid.com/best-angularjs-data-grid/index.php
试试这些东西,看看它是否适合你。