Angular中使用mydatepicker出现日期显示提前一天问题

这个坑我之前踩过！你遇到的日期早一天的问题，根源在于toISOString()这个方法——它会把本地时区的日期对象转换成UTC时区的字符串，而mydatepicker返回的jsdate是对应你本地时区的「当日0点」，当你的时区比UTC早（比如东八区），这个时间转成UTC就会变成前一天的下午/晚上，截取前10位自然就得到了前一天的日期。

既然项目不让用moment，我们可以直接手动提取本地日期的年、月、日来拼接，完全避开时区问题：

onDateChange(event) {
  const selectedDate = event.jsdate;
  // 获取本地时区的年、月、日
  const year = selectedDate.getFullYear();
  // 注意：月份是从0开始计数的，所以要加1
  const month = String(selectedDate.getMonth() + 1).padStart(2, '0');
  const day = String(selectedDate.getDate()).padStart(2, '0');

  // 生成你需要的两种格式二选一
  this.selectDate = `${year}-${month}-${day}`; // 输出：2018-03-20
  // this.selectDate = `${year}${month}${day}`; // 输出：20180320
}

如果你的项目环境不支持ES2017的padStart方法，可以自己写个简单的补零函数兼容：

// 补零工具函数
private padZero(num: number): string {
  return num < 10 ? `0${num}` : `${num}`;
}

// 调用的时候替换成：
const month = this.padZero(selectedDate.getMonth() + 1);
const day = this.padZero(selectedDate.getDate());

这种方法直接读取本地时区的日期信息，完全不会受UTC转换的影响，就能准确得到用户选中的日期啦！

内容的提问来源于stack exchange，提问作者apple_92