'{ from: string; 类型的参数到：字符串； }' 不可分配给类型为 'string | 的参数日期'。在 flatpickr 中启用日期

Question

我正在尝试在与 angular 集成的 flatpickr 日历中启用日期。因此，当我尝试推送启用日期对象以启用 flatpickr 的配置选项时，我得到Argument of type '{ from: string; to: string; }' is not assignable to parameter of type 'string | Date'.

这里是配置代码。 flatpickr：-

this.exampleOptions = {
  dateFormat: "d.m.Y",
  minDate: "today",
  maxDate: "",
  onChange: function (selectedDates, dateStr) {
    // console.log('selected date is ', selectedDates);
    console.log('latest selected dates ', dateStr);
    this.selectedDate = selectedDates;
    this.dateSelected = selectedDates;
    console.log('this.dateSelected ', this.dateSelected);
    console.log('this.selectedDate ', this.selectedDates);
  }
};

在一个函数中，我使用该配置对象来启用日期：-

allAboutDateAndTime(){
  if (this.experienceData.dateRangeList != null && this.experienceData.dateRangeList != undefined && this.experienceData.dateRangeList.length > 0) {
  this.experienceData.dateRangeList.forEach((date: DateRange) => {
    const from = date.startDate.toString();
    const to = date.endDate.toString();
    const enable = {
      from: from,
      to: to
    };
    this.exampleOptions.enable.push(enable); // GETTING ERROR HERE
  });
}

这是我遇到的错误

Argument of type '{ from: string; to: string; }' is not assignable to parameter of type 'string | Date'. Type '{ from: string; to: string; }' is missing the following properties from type 'Date': toDateString, toTimeString, toLocaleDateString, toLocaleTimeString, and 38 more

我希望它能够启用 flatpickr documentaion 中给出的指定日期

Answer 1

当您使用 Angular 时，我猜您一定在使用 ng2-flatpickr。我尝试下载他们的 Javascript 包flatpickr 和ng2-flatpickr，我才知道他们的 angular 包没有 JS 包的所有功能！

根据他们的 JS 包，该 enable 属性应该是下图显示的类型...

根据他们的 Angular 包，enable 属性应该是...的类型

因此，您可能无法使用 angular 包来实现您的需要。您应该尝试在您的 Angular 项目中使用 JS 包，或者您必须在他们的 Angular 包 github 存储库中提出问题。

Bug - enable option should support function #57

已经有一个与此相关的问题，要求他们使 enable 属性应该像 JS 包一样接受该功能！

所以你可以在那里提出你的问题！或者，如果您想在项目中以某种方式实现它，请尝试使用他们的 JS 包！

Answer 2

您是否尝试使用相同的 console.log(this.experienceData) 来检查它是什么类型的对象以及它具有哪些属性和方法？也许启用数组从未分配过自己，您必须在使用之前将其初始化为空数组？

您似乎正在尝试为现有属性分配不同类型的属性或推送到不包含您尝试引入的此类对象的数组。

试试这个：

this.exampleOptions.enable= [{ 来自：“2025-04-01”， 至：“2025-05-01” }]

如果它仍然出错，那么您的代码中存在错误分配类型或未初始化数组的内容。

更新

试试

this.exampleOptions = {
  dateFormat: "d.m.Y",
  minDate: "today",
  maxDate: "",
  enable: ["2015-12-01"]
  onChange: function (selectedDates, dateStr) {
    // console.log('selected date is ', selectedDates);
    console.log('latest selected dates ', dateStr);
    this.selectedDate = selectedDates;
    this.dateSelected = selectedDates;
    console.log('this.dateSelected ', this.dateSelected);
    console.log('this.selectedDate ', this.selectedDates);
  }
};

尝试将对象与启用数组和一些适合格式的随机值一起初始化，看看它是否有效。否则，请尝试为每个变量分配正确的类型。