Aurelia с ошибкой использования jquery datatables

У меня проблемы с использованием таблиц данных jquery с Aurelia. Я пытаюсь импортировать данные, но безуспешно. Когда я пытаюсь инициализировать его, появляется ошибка

Отклонение необработанного обещания TypeError: $ (...). DataTable не является функцией (…)

Мой машинописный код выглядит следующим образом:

import * as $ from 'jquery';
import * as dataTable from 'datatables';
export class App {
router: Router;

constructor() {}
attached() {
    $('#example').dataTable({
        "paginate": true,
        "pageLength": 25
    });
} 
 activate() {  
    console.log("app.activate");
}....

Есть указатели? Ваше здоровье :)


javascript jquery datatables jspm aurelia
person ecif    schedule 20.02.2016    source источник
comment
я не знаю, что такое таблицы данных, но я бы попробовал использовать import $ from 'jquery' или import 'jquery', а также import 'datatables'   -  person Matthew James Davis    schedule 21.02.2016

Ответы (2)


arrow_upward
2
arrow_downward

У вас есть пара проблем, которые будут вызывать у вас головную боль.

Во-первых, jQuery экспортирует переменную по умолчанию $. Таким образом, вы можете сделать следующее, чтобы импортировать jQuery внутри ViewModel:

import 'jquery';

Во-вторых, плагин DataTables расширяет прототип библиотеки jQuery, добавляя себя к объекту jQuery. Итак, чтобы это работало, вам нужно сначала включить jQuery, а затем плагин DataTables.

Я не видел экспорта по умолчанию для использования на стороне клиента, поэтому это должно дать вам следующий и, надеюсь, функциональный код:

import 'jquery';
import 'datatables';

Если я не упустил из виду конкретную деталь, я считаю, что это должно решить проблему. Если нет, оставьте комментарий ниже, и мы рассмотрим его в любом случае.

person Dwayne Charrington    schedule 22.02.2016
comment
Привет, пробовал разные способы и обнаружил, что все заработало, когда я просто вызвал import dataTable как функцию в методе activate () ‹br› ›activate () {› dataTable (); ... ›} Импортировав способ, который вы предложили, я получил jquery 'undefined', когда я попытался сохранить его в console.log. - person ecif; 22.02.2016
comment
Как и где вы в консоли регистрируете экспорт $ из jQuery? Потому что, если вы сделаете это извне приложения, я считаю, что это не сработает, поскольку все внутри системы модулей инкапсулируется из глобального пространства имен. Если бы вы были в console.log ($); внутри connected () вы обязательно должны увидеть, что он что-то отображает. - person Dwayne Charrington; 22.02.2016
comment
Эй, когда я пытаюсь импортировать его по-вашему, я получаю сообщение об ошибке src \ app.ts (6,8): error TS1192: Модуль jquery не имеет экспорта по умолчанию. Поэтому мне нужно импортировать его import * как $ from 'jquery'; - person ecif; 23.02.2016
comment
Интересный. Вы также пробовали просто использовать import 'jquery' в верхней части ViewModel? Я считаю, что это должно работать, поскольку jQuery будет настраивать глобальные объекты изнутри. - person Dwayne Charrington; 24.02.2016

arrow_upward
1
arrow_downward

[Решено] Я заставил это работать, инициализировав datatable в методе activate () и оставив мои импорты такими, какие они есть ...

activate() {  
   datatable();
   console.log("app.activate");
}....

Попробовал еще немного, обнаружил, что это тоже работает ...

import * as $ from 'jquery';
import "datatables";
//import * as dataTable from "datatable";

export class DatatablesExample {    
   //activate() {
   //    dataTable();
   //}
    attached() {
        $('#example').dataTable();
    }
}

Угадайте, что моя проблема заключалась в импорте jQuery. Но мне интересно, почему рекомендуемый импорт не работает для jquery ...

импортировать $ из 'jquery';

person ecif    schedule 23.02.2016
comment
Этот код работал у меня. import $ from 'jquery'; import dataTable from 'datatables'; - person Kevin Vasko; 03.06.2016