Angular 4日期范围选择器中Moment对象转标准日期格式问题

嘿，这个问题我之前在Angular项目里也碰到过！其实根本不用绕JSON.stringify和new Date的弯路，直接用Moment自带的方法就能完美解决～

核心解决方案：直接用Moment对象的格式化方法 #

既然你从daterangepicker拿到的start和end本身就是Moment对象，完全不需要做多余的类型转换，直接调用它的format()方法就能得到你要的'YYYY-MM-DD'格式：

// 假设这是你的日期选择回调函数
onDateRangeSelected(selectedRange: { start: moment.Moment, end: moment.Moment }) {
  // 直接格式化起始和结束日期
  const formattedStartDate = selectedRange.start.format('YYYY-MM-DD');
  const formattedEndDate = selectedRange.end.format('YYYY-MM-DD');

  console.log(formattedStartDate); // 输出示例：'2018-04-16'
  console.log(formattedEndDate); // 输出示例：'2018-05-01'
}

为什么之前的方法会报错？ #

你之前尝试JSON.stringify(datepicker.start)得到的ISO格式字符串（比如2018-04-16T05:00:00.000Z），其实是Moment对象调用toJSON()方法返回的UTC时区字符串。如果你的本地时区和UTC不一致，直接用new Date()转换时会出现日期偏移，再传给Moment解析就可能触发"invalid date"错误——这完全是多此一举的操作。

万一已经拿到了ISO字符串怎么办？ #

如果因为某些原因你只能拿到那个ISO格式的字符串，也别用new Date()，直接用Moment解析再格式化：

const isoDateString = '2018-04-16T05:00:00.000Z';
const formattedDate = moment(isoDateString).format('YYYY-MM-DD');
// 同样能得到正确的'2018-04-16'，Moment会自动处理时区差异

小提醒 #

确保你的Angular项目已经正确安装并引入了Moment.js，组件里记得导入moment：

import * as moment from 'moment';

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