角度数据表:未知提供者

Mor*_*p25 2 javascript datatable jquery angularjs angular-datatables

嘿伙计们.

我是JS和Angular的新手,试图在我的项目中实现angular-datatable版本.

首先,我使用了"角度方式",根据性能,这是一个糟糕的决定.我的表中有很多行.所以我决定尝试使用ajax构建我的数据表并使用dtOptionsBuilder构建我的列并使用dtOptions填充表.

但是,我有一些复杂性...我得到一个未知的提供程序错误..更具体地说:

错误:[$ injector:unpr]未知提供者: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')
];
Run Code Online (Sandbox Code Playgroud)

我已将数据表注入我手册中列出的app.module.js中.

'use strict';
(function() {
    angular.module('app', ['ui.router', 'invoices', 'ngDialog', 'infinite-scroll', 'datatables']);
})();
Run Code Online (Sandbox Code Playgroud)

提前致谢!

Ofi*_*ris 7

请参阅其网站中的示例:

您只需要注入datatables模块.

从控制器中删除依赖项.

  • 那就做到了!谢谢!:) (2认同)