angular - 如何在 Angular/TypeScript 中使用 flatpickr rangePlugin

Question

我想在我的 Angular 项目中使用 flatpickr 和 rangePlugin，但是在 TypeScript 中导入插件后我无法实例化 rangePlugin。

打字稿错误： Only a void function can be called with the 'new' keyword.ts(2350)

我导入插件的方式是：

import rangePlugin from 'flatpickr/dist/plugins/rangePlugin';
import flatpickr from 'flatpickr';

我尝试以这种方式使用插件：

const range = new rangePlugin({ input: '#datepicker2' }));

这会产生上述错误。

如何正确导入 rangePlugin？

Answer 1

// First do the imports
import flatpickr from 'flatpickr';
import rangePlugin from 'flatpickr/dist/plugins/rangePlugin';

// Then you can use the flatpickr anyway you want inside ngOnInit, as plain javascript
ngOnInit(): void {
    flatpickr("#enterYourIdHere", {
        plugins: [
            rangePlugin({
                //Enter your options here
            })
        ]
    });
}

Answer 2

错误不言自明。从函数中删除“新”。

plugins: [rangePlugin({ input: myInput })]

您还需要声明要传递给 rangePlugin 函数的元素。

const myInput = document.getElementById('datepicker2') as HTMLInputElement;

Answer 3

尝试

declare const flatpickr: any;

代替

 import flatpickr from 'flatpickr';

或者

寻找那个。

https://flatpickr.js.org/getting-started/#usage