Question

我正在尝试禁用用户已预订活动的所有日期。我使用的是https://www.npmjs.com/package/ng-pick-datetime TypeScript和Angular6。我对Java较为满意，但可以自己学习一些Javascript。

.TS

    getUserEvents() {
    this._calendarService.getAllEvent().subscribe(res => {
      this.allEvents = res.json();
    });
  }

  filterForbiddenDays() {
    this.allEvents.forEach(d => {
      let day = {
        'start': new Date(d.startDate.value),
        'end': new Date(d.endDate.value)
      };
      this.forbiddenDays.push(day);
    });
  }

  public myFilter = (d: Date): boolean => {
    //return this.forbiddenDays[0].start.getDate() !== d.getDate() && this.forbiddenDays[1].start.getDate() !== d.getDate() // <-- THIS WORKS GREAT
    this.forbiddenDays.filter(data => {
      return data.start.getDate() !== d.getDate() // <-- TRUE SHOULD CHANGE COLOR ON DAY IN CALENDAR
    });
    return false;
  }

如果我映射forbiddenDays数组而不是forEach，我可以看到我对forbiddenDays中的每个事件都是正确的，这应该更改日历中这些日期的颜色。

但是现在myFilter方法导致以下结果： pic of calendar

我在做什么错？我觉得问题出在myFilter方法中。

.HTML

    <div class="example-wrapper datePicker">
        <label class="example-input-wrapper" id="eventInputSuccess">
            <input (click)="filterForbiddenDays()" id="eventInputError" placeholder="Click to choose date"
                (dateTimeInput)="basic.openModal()" [(ngModel)]="dateTimeInput" [owlDateTimeTrigger]="dt"
                [owlDateTimeFilter]="myFilter" [owlDateTime]="dt"><i class="fa fa-calendar" aria-hidden="true"></i>
            <owl-date-time #dt [pickerMode]="'dialog'"></owl-date-time>
        </label>
    </div>
</div>

谢谢！

编辑：

return this.forbiddenDays[0].start.getDate() !== d.getDate();

结果：expected result but for all days in my array

因此，当我指定[0]或[3]等索引时，基本上可以很好地工作，但是我不确定为什么它不适用于forEach（）或filter（）

Answer 1

您的函数myFilter始终返回false。

return中的this.forbiddenDays.forEach()仅中断当前迭代，而不会导致函数停止。您必须改用some或every：

public myFilter = (d: Date): boolean => {
    return this.forbiddenDays.every(data => {
        return data.start.getDate() !== d.getDate() // <-- TRUE SHOULD CHANGE COLOR ON DAY IN CALENDAR
    });
}

仅当数组中的所有元素都满足true时，此函数才返回data.start.getDate() !== d.getDate()，否则返回false。

Answer 2

您的myFilter函数始终返回false。 forEach或filter回调的返回不将返回myFilter函数。它只是返回您传递给它的回调，在这种情况下，这毫无意义。

我想你想要的是这样的东西：

public myFilter = (d: Date): boolean => {
  return this.forbiddenDays.every(forbiddenDay => {
    return forbiddenDay.start.getDate() !== d.getDate();
  });
}

如果回调为任何数组元素返回array.every()，则false方法将返回false。

您还可以使用for..of循环编写此代码：

public myFilter = (d: Date): boolean => {
  for (let forbiddenDay of this.forbiddenDays) {
    if (forbiddenDay.start.getDate() !== d.getDate()) {
      return true;
    }
  }
  return false;
}

在布尔TypeScript / JavaScript方法中返回true / false的正确方法？

2 个答案: