Bootstrap Safari 上的 DatePicker / Angular

Question

我需要一些有关 Safari 浏览器的帮助。我有一个 angular 应用程序，它具有 select 在 datepicken 的当周 ngOnInit 上的功能。

它适用于 firefox、brave、chrome 等。

但它不适用于 safari。

不知道怎么解决。 google 搜索对我没有任何帮助。有人说它在 safari 上不起作用，但我不知道如何解决它。

如前所述，我需要一个自动 select 显示当前周的日期选择器。因为我必须在数据库中保存周数 + 年（“22/2022”）。但我也希望能够 select 接下来的几周。

ts 页

  ngOnInit(): void {
    this.onDateSelection(this.calendar.getToday());
  }


  getWeekNumber(from: NgbDate) {
    let currentDate = new Date(from.year, from.month, from.day);

    var oneJan = new Date(currentDate.getFullYear(), 0, 1);
    var numberOfDays = Math.floor(
      (Number(currentDate) - Number(oneJan)) / (24 * 60 * 60 * 1000)
    );

    return Math.ceil((currentDate.getDay() + 1 + numberOfDays) / 7);
  }


  onDateSelection(date: NgbDate) {
    let fromDate = new Date(date.year + "-" + date.month + "-" + date.day);

    let time = fromDate.getDay() ? fromDate.getDay() - 1 : 6;
    fromDate = new Date(fromDate.getTime() - time * 24 * 60 * 60 * 1000);
    this.fromDate = new NgbDate(
      fromDate.getFullYear(),
      fromDate.getMonth() + 1,
      fromDate.getDate()
    );
    const toDate = new Date(fromDate.getTime() + 6 * 24 * 60 * 60 * 1000);
    this.toDate = new NgbDate(
      toDate.getFullYear(),
      toDate.getMonth() + 1,
      toDate.getDate()
    );

    this.currentDate = `${
      this.fromDate.day < 10 ? "0" + this.fromDate.day : this.fromDate.day
    }.${
      this.fromDate.month < 10 ? "0" + this.fromDate.month : this.fromDate.month
    }. - ${this.toDate.day < 10 ? "0" + this.toDate.day : this.toDate.day}.${
      this.toDate.month < 10 ? "0" + this.toDate.month : this.toDate.month
    }.${this.toDate.year}`;


  }


  isHovered(date: NgbDate) {
    return (
      this.fromDate &&
      !this.toDate &&
      this.hoveredDate &&
      date.after(this.fromDate) &&
      date.before(this.hoveredDate)
    );
  }


  isInside(date: NgbDate) {
    return this.toDate && date.after(this.fromDate) && date.before(this.toDate);
  }


  isRange(date: NgbDate) {
    return (
      date.equals(this.fromDate) ||
      (this.toDate && date.equals(this.toDate)) ||
      this.isInside(date) ||
      this.isHovered(date)
    );
  }

html 页

Answer 1

safari 的日期格式正则表达式过多。你必须那样更换。例如

  getWeekNumber(from: NgbDate) {
     let currentDate = new Date(from.year.replace(/-/g, "/"), from.month.replace(/-/g, "/"), from.day.replace(/-/g, "/"));
     ...
  }

Answer 2

只需将新的 Date() 修改为

onDateSelection(date: NgbDate) {
    let fromDate = new Date(date.year, date.month - 1, date.day);
    ...
}

Bootstrap Safari 上的 DatePicker / Angular

Bootstrap DatePicker on Safari / Angular

html

safari

datepicker

bootstrap-4

angular