注入角格企业

Posted 2023-03-28

【中文标题】注入角格企业

【英文标题】：Incjecting angular grid enterprise

【发布时间】：2017-02-26 17:03:09

【问题描述】：

我已经通过 bower 安装了包 angular-grid-enterprise。角度网格的版本是 6.2.1。我在 laravel 项目中使用角度框架。这是default.blade.php的内容，里面存放了所有必要的脚本。

  <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.6/angular.min.js"></script>
<script scr="http://demos.angularcode.com/grid/js/ui-bootstrap-tpls-0.10.0.min.js"></script>
<script src="https://cdn.rawgit.com/esvit/ng-table/1.0.0/dist/ng-table.js"></script>
<script src="/js/dashboard/new.controller.js"></script>
<script src="/bower_components/ag-grid-enterprise/dist/ag-grid-enterprise.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/ag-grid/6.2.1/ag-grid.min.js"></script>

这是我的控制器

var kongres = angular.module('kongres', ["agGrid"]);
kongres.controller('NoviController', NoviController);
function NoviController($scope, $http, $timeout) 

这里应该显示女巫网格中的页面

@extends(isset($layout)?$layout:'layout.default')
@section('content')
<div class="page-content-wrapper" ng-controller="NoviController">
    <!-- BEGIN CONTENT BODY -->
    <div class="page-content">

        <div class="row">
            <div class="col-lg-12 portlet light bordered">
                <div class="portlet-title">
                    <div class="caption font-dark">
                        <i class="icon-people"></i>
                        <span class="caption-subject bold uppercase">Hotel bookings</span>
                    </div>
                </div>
                <div class="portlet-body">
                    @ title 
                    <div ag-grid="gridOptions" style="height: 600px;" class="ag-blue"></div>
                </div>
            </div>
        </div>
        <!-- /.row -->
    </div>
</div>
<!-- /.container-fluid -->
@stop

当我尝试加载页面时，此错误显示angular.js:38Uncaught Error: [$injector:modulerr]。我的问题是如何正确注入这个模块？

【参考方案1】：

您必须在加载 ag-grid-enterprise.js 引用后加载 <script src="/js/dashboard/new.controller.js"></script>

像下面这样重新排序，

 <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.6/angular.min.js"></script>
<script scr="http://demos.angularcode.com/grid/js/ui-bootstrap-tpls-0.10.0.min.js"></script>
<script src="https://cdn.rawgit.com/esvit/ng-table/1.0.0/dist/ng-table.js"></script>
<script src="/bower_components/ag-grid-enterprise/dist/ag-grid-enterprise.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/ag-grid/6.2.1/ag-grid.min.js"></script>
<script src="/js/dashboard/new.controller.js"></script>

DEMO

另外你必须在声明模块之前调用它，

agGrid.initialiseAgGridWithAngular1(angular);

【讨论】：

@user3568043 让我创建一个示例

还是一样，但是我发现当尝试加载ag-grid-enterprise.js时它失败了。`我不知道为什么，当路径很好时。

@user3568043 从该路径中删除 /