How to import Javascript module to angularJs controller-CodePudding

I want to use Tabulator in AngularJs. My code simply is:

 var table = new Tabulator("#example-table-remote", {
            ajaxURL: "/Home/Getpaging",
            pagination: true, //enable pagination
            paginationSize: 10,                
            paginationMode: "remote", //enable remote pagination
            ajaxURLGenerator: function (url, config, params) {
                const { page, size } = params;
                return url   `?page=${page}&size=${size}`;
            },
            ajaxResponse: function (url, params, response) {                  
                let last_page = response.MyData.last_page;
                var mydata = JSON.parse(response.MyData.lstHotel);                   
                return {
                    data: mydata,
                    last_page,
                };
            },
             autoColumns:true,

        });

if I just add my code to my project (not inside of AngularJs controller ) and import following module to my project.

import {TabulatorFull as Tabulator} from 'tabulator-tables';

all Tabulator's modules work fine. But if I just move my code to my AngularJs controller, I get the error:

Tabulator is not defined

if I add tabulator js file directly, the above error disappeared but I get a new error. The new error is:

Data Loading Error - Unable to process data due to invalid data type Expecting: array Received: object

This is because of AngularJs controller can not read modules. I want to know how can I import modules to my angularJS project.

CodePudding user response：

You can include Tabulator using CDN in the index.html file of your app.

In index.html <head> add:

<link href="https://unpkg.com/[email protected]/dist/css/tabulator.min.css" rel="stylesheet">

<script type="text/javascript" src="https://unpkg.com/[email protected]/dist/js/tabulator.min.js"></script>

This would include tabulator in the global scope of the window. import would not be required here, and is not usually the right way of including modules in AngularJS.

Hope this helps.

CodePudding user response：

I checked and thanks to @jabaa I find the solution: First, I add import in my the AngularJs controller file. Then I change the file type to module

Here is the working Demo