$ (...). thirdPartyPlugins - это не функция - Машинопись

Question

Я просто следовал этому руководству , чтобы установить bootstrap-material-datetimepicker на мой проект Angular 5, но просто импортировал jQuery и bootstrap-material-datetimepicker, как это:

import * as $ from 'jquery';
import 'bootstrap-material-datetimepicker';

плагины были разрушены, потому что они не нашли jQuery и момент, поэтому я добавил их в мой .angular-cli.js

Теперь ошибка: ERROR TypeError: $(...).bootstrapMaterialDatePicker is not a function вклвызов $('#date').bootstrapMaterialDatePicker ();

Я также попытался добавить интерфейс в typings.d.ts:

interface JQuery {
   bootstapMaterialDatePicker() : JQuery;
}

и

constructor() {
           $(document).ready(() => {
             console.log($.isFunction($.fn.bootstrapMaterialDatePicker));
      });

(также без $ (dcument).ready и в ngOnInit вместо конструктора) возвращает мне false , но если я запускаю $.isFunction($.fn.bootstrapMaterialDatePicker) в консоли Chrome, он возвращается true

Спасибо за внимание

Answer 1

Если вы используете angular / cli, это должно быть просто:

В вашем файле .angular-cli добавьте ссылки на JQuery и bootstrap-material-datetimepicker:

"scripts": [
    ...
    "../node_modules/jquery/dist/jquery.min.js",
    "../node_modules/bootstrap-material-datetimepicker/js/bootstrap-material-datetimepicker.js"
    ...
]

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

После этого перейдите к компоненту, в котором вы хотите его использовать, и добавьте следующее:

declare var $: any;

А затем используйте его как обычно:

$('#date').bootstrapMaterialDatePicker();

Обратите внимание, что с помощью cli вам не нужно выполнять импорт вручную:

import * as $ from 'jquery';
import 'bootstrap-material-datetimepicker';