Angular datatables export error

Question

I am getting the next error when trying to use angular-datatables.

I have all folders with the settings recommended and I am follow the sample from site http://l-lin.github.io/angular-datatables/archives/#/gettingStarted

The error is in the next lines from angular-datatables.js:

export { DataTablesModule } from './angular-datatables.module';
export { DataTableDirective } from './angular-datatables.directive';

html:

    <div ng-app='clinang' ng-controller="pacientesCtrl">
      <h4>Cadastro de pacientes</h4>
      <table datatable="" dt-options="pacientesCtrl.dtOptions" dt-columns="pacientesCtrl.dtColumns" class="row-border hover"></table>
   </div>

Here is my JS:

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script src="files/lib/bootstrap/bootstrap.js"></script>
<!-- Latest compiled and minified JavaScript -->
<link rel="stylesheet" href="files/lib/bootstrap/bootstrap.css" >

    <script src="files/lib/angular/angular.js"></script>
    <script src="files/lib/angular-datatables/angular-datatables.js"></script>
    <script src="https://nightly.datatables.net/js/jquery.dataTables.js"></script>

    <script src="files/lib/bootstrap/ui-bootstrap-tpls-2.5.0.js"></script>

    <link href="https://cdn.datatables.net/1.10.13/css/dataTables.bootstrap.min.css" rel="stylesheet" type="text/css" />
    <link rel="stylesheet" href="files/lib/angular-datatables/angular-datatables.css">

    <script src="files/js/controllers/pacientesCtrl.js"></script>

    <script type="text/javascript">
        angular.module('clinang',[]);
        angular.module('clinang', ['ui.bootstrap','datatables']);
    </script>

pacientesCtrl.js:

angular.module('clinang').controller('pacientesCtrl', function (DTOptionsBuilder, DTColumnBuilder) {
    var vm = this;
    vm.dtOptions = DTOptionsBuilder.fromSource('/getdadospac/?oper=S')
        .withPaginationType('full_numbers');
    vm.dtColumns = [
        DTColumnBuilder.newColumn('pront').withTitle('pront'),
        DTColumnBuilder.newColumn('nome').withTitle('Nome'),
        DTColumnBuilder.newColumn('endereco').withTitle('Endereço').notVisible()
    ];
});

Error:

angular-datatables.js:12 Uncaught SyntaxError: Unexpected token export
angular.js:4759 Uncaught Error: [$injector:modulerr] Failed to instantiate module clinang due to:
Error: [$injector:modulerr] Failed to instantiate module datatables due to:
Error: [$injector:nomod] Module 'datatables' is not available! You either misspelled the module name or forgot to load it. If registering a module ensure that you specify the dependencies as the second argument.
http://errors.angularjs.org/1.6.1/$injector/nomod?p0=datatables
    at http://127.0.0.1:8888/files/lib/angular/angular.js:68:12
    at http://127.0.0.1:8888/files/lib/angular/angular.js:2183:17
    at ensure (http://127.0.0.1:8888/files/lib/angular/angular.js:2107:38)
    at module (http://127.0.0.1:8888/files/lib/angular/angular.js:2181:14)
    at http://127.0.0.1:8888/files/lib/angular/angular.js:4736:22
    at forEach (http://127.0.0.1:8888/files/lib/angular/angular.js:357:20)
    at loadModules (http://127.0.0.1:8888/files/lib/angular/angular.js:4720:5)
    at http://127.0.0.1:8888/files/lib/angular/angular.js:4737:40
    at forEach (http://127.0.0.1:8888/files/lib/angular/angular.js:357:20)
    at loadModules (http://127.0.0.1:8888/files/lib/angular/angular.js:4720:5)
http://errors.angularjs.org/1.6.1/$injector/modulerr?p0=datatables&p1=Error%3A%20%5B%24injector%3Anomod%5D%20Module%20'datatables'%20is%20not%20available!%20You%20either%20misspelled%20the%20module%20name%20or%20forgot%20to%20load%20it.%20If%20registering%20a%20module%20ensure%20that%20you%20specify%20the%20dependencies%20as%20the%20second%20argument.%0Ahttp%3A%2F%2Ferrors.angularjs.org%2F1.6.1%2F%24injector%2Fnomod%3Fp0%3Ddatatables%0A%20%20%20%20at%20http%3A%2F%2F127.0.0.1%3A8888%2Ffiles%2Flib%2Fangular%2Fangular.js%3A68%3A12%0A%20%20%20%20at%20http%3A%2F%2F127.0.0.1%3A8888%2Ffiles%2Flib%2Fangular%2Fangular.js%3A2183%3A17%0A%20%20%20%20at%20ensure%20(http%3A%2F%2F127.0.0.1%3A8888%2Ffiles%2Flib%2Fangular%2Fangular.js%3A2107%3A38)%0A%20%20%20%20at%20module%20(http%3A%2F%2F127.0.0.1%3A8888%2Ffiles%2Flib%2Fangular%2Fangular.js%3A2181%3A14)%0A%20%20%20%20at%20http%3A%2F%2F127.0.0.1%3A8888%2Ffiles%2Flib%2Fangular%2Fangular.js%3A4736%3A22%0A%20%20%20%20at%20forEach%20(http%3A%2F%2F127.0.0.1%3A8888%2Ffiles%2Flib%2Fangular%2Fangular.js%3A357%3A20)%0A%20%20%20%20at%20loadModules%20(http%3A%2F%2F127.0.0.1%3A8888%2Ffiles%2Flib%2Fangular%2Fangular.js%3A4720%3A5)%0A%20%20%20%20at%20http%3A%2F%2F127.0.0.1%3A8888%2Ffiles%2Flib%2Fangular%2Fangular.js%3A4737%3A40%0A%20%20%20%20at%20forEach%20(http%3A%2F%2F127.0.0.1%3A8888%2Ffiles%2Flib%2Fangular%2Fangular.js%3A357%3A20)%0A%20%20%20%20at%20loadModules%20(http%3A%2F%2F127.0.0.1%3A8888%2Ffiles%2Flib%2Fangular%2Fangular.js%3A4720%3A5)
    at http://127.0.0.1:8888/files/lib/angular/angular.js:68:12
    at http://127.0.0.1:8888/files/lib/angular/angular.js:4759:15
    at forEach (http://127.0.0.1:8888/files/lib/angular/angular.js:357:20)
    at loadModules (http://127.0.0.1:8888/files/lib/angular/angular.js:4720:5)
    at http://127.0.0.1:8888/files/lib/angular/angular.js:4737:40
    at forEach (http://127.0.0.1:8888/files/lib/angular/angular.js:357:20)
    at loadModules (http://127.0.0.1:8888/files/lib/angular/angular.js:4720:5)
    at createInjector (http://127.0.0.1:8888/files/lib/angular/angular.js:4642:19)
    at doBootstrap (http://127.0.0.1:8888/files/lib/angular/angular.js:1838:20)
    at bootstrap (http://127.0.0.1:8888/files/lib/angular/angular.js:1859:12)
http://errors.angularjs.org/1.6.1/$injector/modulerr?p0=clinang&p1=Error%3A%20%5B%24injector%3Amodulerr%5D%20Failed%20to%20instantiat......

Facing the same issue. Any solution ?

Akshat G
– Akshat G

2017-02-12 06:34:15 +00:00
Commented Feb 12, 2017 at 6:34 — Akshat G
– Akshat G, Commented Feb 12, 2017 at 6:34
Hi, until now, I have no solution.

Luiz Alves
– Luiz Alves

2017-02-13 22:13:57 +00:00
Commented Feb 13, 2017 at 22:13 — Luiz Alves
– Luiz Alves, Commented Feb 13, 2017 at 22:13

Esteban · Accepted Answer · 2017-02-15 21:26:05Z

2

You can edit /angular-datatables/dist/angular-datatables.js.map in sources, here you will find a call to the typescript file, if you put the same file as a .js this change to the next line but with the same error, I have a similar problem...

answered Feb 15, 2017 at 21:26

Esteban

711 silver badge9 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Nikolay Fominyh Over a year ago

Please provide some examples to OP.

Esteban Over a year ago

Please check this issue: github.com/l-lin/angular-datatables/issues/971 maybe it could help to resolve the problem. I'm trying but the problem is that i use Laravel 5.3 with adminLTE template and this latter requires another version of JQuery then i'm trying to resolves this issue into my project with angular-datatables. Let me know if you can resolve...

Esteban · Accepted Answer · 2017-02-16 19:20:14Z

This is the correct order:

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script src="../../datatables.min.js"></script>
<script src="/../bootstrap/js/bootstrap.min.js"></script>
<script src="/../angular/angular.min.js"></script>
<script src="/../angular-datatables/demo/src/archives/dist/angular-datatables.min.js"></script>

This is the right order, keep in mind that the routes I am using are different from yours so you must validate that the mentioned files exist, in the order indicated. For the angular-datatables.min.js file you can change the path to path: /angular-datatables/angular-datatables.min.js, just in case it does not work you can use the one I indicated before. I hope this can help them :)

Kannan K · Accepted Answer · 2018-03-07 17:28:01Z

0

Try using version angular-datatables 0.6.2:

<script src="https://cdnjs.cloudflare.com/ajax/libs/angular-datatables/0.6.2/angular-datatables.min.js"></script>

edited Mar 7, 2018 at 17:28

answered Mar 7, 2018 at 17:22

Kannan K

4,4911 gold badge15 silver badges27 bronze badges

Collectives™ on Stack Overflow

Angular datatables export error

3 Answers 3

2 Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

2 Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related