2016-01-28 104 views
1

Hej guys。Angular Datatables:Unknown provider

我是JS和Angular的新手,試圖在我的項目中實現angular-datatable版本。

首先,我使用了「角度方式」,結果是基於性能的糟糕決定。我的桌子上有很多行。所以我決定嘗試使用ajax構建我的數據表,並使用dtOptionsBuilder構建我的列並使用dtOptions填充表。

不過,我有一些併發症......我得到一個未知的提供程序錯誤。更具體:

Error: [$injector:unpr] Unknown provider: datatablesProvider <- datatables <- OverviewCtrl

我不太清楚,我在做什麼錯?這是我的控制器。

angular.module("invoices").controller("OverviewCtrl", ["apiService", "datatables", 'utilsService', "$q", "invoiceService", "ngDialog", "$controller", "authFactory", "redirectService", "$rootScope", OverviewCtrl]); 

function OverviewCtrl(apiService, utilsService, dtOptionsBuilder, dtColumnBuilder, $q, invoiceService, ngDialog, $controller, authFactory, redirectService, $rootScope) { 
var NUMBER_OF_TIMEENTRIES_TO_SHOW = 10; 
var vm = this; 

if (!authFactory.identity.isAuthenticated) { 
    redirectService.redirect("overview", 2, "login", 3); 
} 



vm.dtOptions = dtOptionsBuilder.fromSource(vm.latestInvoices) 
.withPaginationType('full_numbers'); 
vm.dtColumns = [ 
    dtColumnBuilder.newColumn('CompanyName').withTitle('Client'), 
    dtColumnBuilder.newColumn('ProjectName').withTitle('Project'), 
    dtColumnBuilder.newColumn('InvoiceID').withTitle('ID'), 
    dtColumnBuilder.newColumn('InvoiceDate').withTitle('Inv. Date'), 
    dtColumnBuilder.newColumn('InvoiceStart').withTitle('Start Date'), 
    dtColumnBuilder.newColumn('InvoiceEnd').withTitle('End Date'), 
    dtColumnBuilder.newColumn('DKKexVAT').withTitle('DKK ex VAT'), 
    dtColumnBuilder.newColumn('CustomerInvoiceGroup.Label').withTitle('CIG'), 
    dtColumnBuilder.newColumn('Attention').withTitle('Attention'), 
    dtColumnBuilder.newColumn('CustManager').withTitle('Customer Manager'), 
    dtColumnBuilder.newColumn('Regarding').withTitle('Regarding'), 
    dtColumnBuilder.newColumn('DueDate').withTitle('Due Date'), 
    dtColumnBuilder.newColumn('Finalized').withTitle('Finalized'), 
    dtColumnBuilder.newColumn('Paid').withTitle('Paid') 
]; 

我已經將數據表注入到我的app.module.js中,如手冊中所列。

'use strict'; 
(function() { 

    angular.module('app', ['ui.router', 'invoices', 'ngDialog', 'infinite-scroll', 'datatables']); 



})(); 

在此先感謝!

+0

這是依賴注入錯誤。你需要包含'datatables'js librabry。 –

+0

它是否在index.html中引用?包含的包是什麼? –

+0

我已根據手冊加載了所需的庫。 ' – Mortenkp25

回答

5

見thier site的例子:

你只需要注入datatables到模塊。

從控制器中刪除依賴項。

+2

這樣做!謝謝! :) – Mortenkp25

+0

當然,看到更多的例子在http://l-lin.github.io/angular-datatables/#/gettingStarted – Ofiris

相關問題