Я пытаюсь добавить плагин jQuery в проект angular, но получаю следующую ошибку при запуске проекта:
core.js:6014 ERROR TypeError: jquery__WEBPACK_IMPORTED_MODULE_2__(...).datepicker is not a function
Я установил jQuery и поместил плагин в папке активов, затем добавил ссылку на оба файла angular. json;
"styles": [
"node_modules/bootstrap/dist/css/bootstrap.min.css",
"src/assets/fontawesome/css/fontawesome-all.css",
"src/assets/lib/datepicker-modal/css/datepicker.css",
"src/styles.scss"
],
"scripts": [
"node_modules/jquery/dist/jquery.min.js",
"node_modules/popper.js/dist/popper.min.js",
"node_modules/bootstrap/dist/js/bootstrap.min.js",
"src/assets/lib/datepicker-modal/js/datepicker.js",
"src/assets/js/script.js"
]
В моем компоненте я объявляю jQuery, чтобы я мог его использовать, и затем в методе ngOnInit я пытаюсь вызвать средство выбора даты, но, похоже, именно здесь я получаю сообщение об ошибке. Как будто скрипт datepicker js не включен в проект или недоступен из моего компонента.
import {Component, Input, OnInit} from '@angular/core';
import {FormGroup} from '@angular/forms';
import * as $ from 'jquery';
@Component({
selector: 'app-date-input',
templateUrl: './date-input.component.html',
styleUrls: ['./date-input.component.scss']
})
export class DateInputComponent implements OnInit {
@Input() parentForm: FormGroup;
@Input() name: string;
constructor() { }
ngOnInit() {
$(
function() {
// Initialise datepicker
$('[data-toggle="datepicker"]').datepicker({
daysMin: ['Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat'],
language: 'en-GB',
format: 'dd/mm/yyyy',
autoHide: true,
zIndex: 2048,
autoPick: true
}).on('hide.datepicker', function (e) {
$(this).removeClass('visible');
}).on('show.datepicker', function (e) {
$(this).addClass('visible');
});
}
);
}
}
Где я ошибаюсь? Я сделал это на другом проекте, и скрипт работает нормально.