2015-01-06 93 views
4

我正在構建一個包含角度數據表的報表。當我執行我的網頁我在angular.js文件得到一個錯誤,指出不確定是不是與其他一些代碼沿功能:angular-datatables錯誤 - undefined不是函數

TypeError: undefined is not a function 
at Object._showLoading [as showLoading] (http://localhost:55823/Scripts/angular-datatables/angular-datatables.renderer.js:8:23) 
at showLoading (http://localhost:55823/Scripts/angular-datatables/angular-datatables.directive.js:25:39) 
at postLink (http://localhost:55823/Scripts/angular-datatables/angular-datatables.directive.js:17:26) 
at http://localhost:55823/Scripts/angular-1.2.19/angular.js:7050:44 
at nodeLinkFn (http://localhost:55823/Scripts/angular-1.2.19/angular.js:6648:13) 
at compositeLinkFn (http://localhost:55823/Scripts/angular-1.2.19/angular.js:6039:13) 
at nodeLinkFn (http://localhost:55823/Scripts/angular-1.2.19/angular.js:6642:24) 
at compositeLinkFn (http://localhost:55823/Scripts/angular-1.2.19/angular.js:6039:13) 
at compositeLinkFn (http://localhost:55823/Scripts/angular-1.2.19/angular.js:6042:13) 
at compositeLinkFn (http://localhost:55823/Scripts/angular-1.2.19/angular.js:6042:13) <table datatable="" dt-options="dtOptions" dt-columns="dtColumns" class="row-border hover datatable ng-isolate-scope"> 

這裏是我的角度功能建設我的表:

var manageBackOrdersApp = angular.module('manageBackOrdersApp', ['sharedApp', 'datatables']); 

(function() { 

var manageBackOrdersController = function ($scope, $http, DTOptionsBuilder, DTColumnBuilder) { 
    $scope.dtOptions = DTOptionsBuilder.fromSource('/Customer/ManageBackOrders/firstJson') 
      .withPaginationType('full_numbers').withDisplayLength('1000'); 
    $scope.dtColumns = [ 
     DTColumnBuilder.newColumn('CustID').withTitle('Cust ID') 
      .renderWith(function(data, type, full, meta) { 
       return '<a target="_blank" href="gmail.com">' + full.CustID + '</a>' 
      }), 
     DTColumnBuilder.newColumn('SOID').withTitle('SO ID') 
      .renderWith(function(data, type, full, meta) { 
       return '<a target="_blank" href="gmail.com">' + full.SOID + '</a>' 
      }), 
     DTColumnBuilder.newColumn('CreateDate').withTitle('SO Date'), 
     DTColumnBuilder.newColumn('SPerName').withTitle('Sales Rep'), 
     DTColumnBuilder.newColumn('ItemID').withTitle('Item') 
      .renderWith(function (data, type, full, meta) { 
       return '<a target="_blank" href="gmail.com">' + full.ItemID + '</a>' 
      }), 
     DTColumnBuilder.newColumn('CurWhseID').withTitle('Cur Whse'), 
     DTColumnBuilder.newColumn('QtyOnBO').withTitle('QtyOnBO'), 
     DTColumnBuilder.newColumn('WhseID').withTitle('Avail Whse'), 
     DTColumnBuilder.newColumn('QtyAvail').withTitle('Qty Avail'), 
     DTColumnBuilder.newColumn('ShipMethDesc').withTitle('Ship Via'), 
     DTColumnBuilder.newColumn('HoldReason').withTitle('Comments') 
    ]; 

} 

manageBackOrdersController.$inject = ['$scope', '$http', 'DTOptionsBuilder', 'DTColumnBuilder']; 

angular.module('manageBackOrdersApp').controller('manageBackOrdersController',  manageBackOrdersController) 

}()); 

最後,這裏是我的html:

<div ng-controller="manageBackOrdersController"> 
<div class="dataTable_top"> 
    <br class="clearit" /> 
</div> 
<table datatable="" dt-options="dtOptions" dt-columns="dtColumns" class="row-border hover datatable"></table> 
</div> 

我不知道如果我失去了一些東西或有東西壞了。據我所知,我擁有所有需要的數據表的工作。當我運行我的頁面時,數據表加載足以顯示加載部分,然後出錯。謝謝。

回答

5

我猜你正在使用v0.1.1。

我認爲問題來自於Angular沒有使用jQuery,而是使用它的jqlite。 您需要首先包含jQuery和數據表,然後使用Angular和最終的角度數據表:

<script src="jquery.min.js"></script> 
<script src="jquery.dataTables.min.js"></script> 
<script src="angular.min.js"></script> 
<script src="angular-datatables.min.js"></script> 
相關問題