甘特图未在angularjs的ui视图中加载

Question

我在我的项目中使用 ui-router。我需要使用甘特图。我参考了这个链接http://rawgit.com/angular-gantt/angular-gantt/master/demo/dist/index.html。

我收到了这个错误

Error: [$compile:ctreq] http://errors.angularjs.org/1.3.14/$compile/ctreq?p0=gantt&p1=ganttTable
    at Error (native)
    at http://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js:6:417
    at D (http://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js:56:98)
    at A (http://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js:59:241)
    at g (http://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js:51:299)
    at g (http://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js:51:316)
    at g (http://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js:51:316)
    at g (http://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js:51:316)
    at g (http://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js:51:316)
    at g (http://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js:51:316) <div ui-view="" class="ng-scope">

Answer 1

确保您在视图中具有相关的依赖关系和正确的指令组织：http://plnkr.co/edit/XYYkD8tf5b2LQs5kL5nx?p=info

如果指令在其定义中使用“require”但找不到所需的控制器（这意味着它预期的父级或兄弟级上的某些指令不存在），则会发生此错误

HTML

<div gantt data="data">
    <!-- <gantt-table columns="['model.name']"></gantt-table> -->
    <gantt-tree></gantt-tree>
    <gantt-groups></gantt-groups>
    <gantt-tooltips></gantt-tooltips>
    <gantt-bounds></gantt-bounds>
    <gantt-progress></gantt-progress>
    <gantt-sortable></gantt-sortable>
    <gantt-movable></gantt-movable>
    <gantt-draw-task></gantt-draw-task>
    <gantt-resize-sensor></gantt-resize-sensor>
</div>

JS

var app = angular.module('plnkrGanttStable',
['gantt',
'gantt.sortable',
'gantt.movable',
'gantt.drawtask',
'gantt.tooltips',
'gantt.bounds',
'gantt.progress',
'gantt.table',
'gantt.tree',
'gantt.groups',
'gantt.resizeSensor'
]);

有关详细信息，请参阅堆栈跟踪中的错误 URL https://docs.angularjs.org/error/$compile/ctreq?p0=gantt&p1=ganttTable%20at%20Error%20(native)