Question

我从rails服务器获取一些元数据信息，这些信息具有电话图片的日期时间属性。我想用angularJS以本地格式显示该日期，这是我从rails获得的日期：

2018-05-09 09:46:33 UTC

这是angularJS方面的代码：

getDateTimeOriginal: =>
      if @metadata? and @metadata.date_time_original?
        dateTime = new Date(@metadata.date_time_original)
        moment(dateTime).format('DD-MMM-YYYY h:mm A')

它在Chrome中完美运行，但我在Firefox中获得了无效日期！

Answer 1

确实，according to the MDN page on Date，应该避免通过日期构造函数或日期解析解析日期字符串：

注意：由于浏览器差异和不一致，强烈建议不要使用Date构造函数（和Date.parse，它们是等效的）解析日期字符串。对RFC 2822格式字符串的支持仅限于惯例。对ISO 8601格式的支持不同之处在于，仅限日期的字符串（例如＆＃34; 1970-01-01＆＃34;）被视为UTC，而不是本地。

由于您的日期时间格式不是ISO8601 compliant，如果您尝试直接提供日期时间字符串，则会遇到同样的问题。

据我说，您应该用时刻解析日期字符串（使用parse方法+指定格式）。请注意并使用moment.utc，因为您有UTC日期时间。然后你可以返回一个JS Date（本地日期）并依赖它的toLocale...方法：

toLocaleTimeString()：MDN doc
toLocaleDateString()：MDN doc
toLocaleString()：MDN doc

这可能会给出类似的结果（我将你的coffeescript代码翻译成普通的Javascript / Ecmascript，这样对于那些会回答这个问题的人来说它会更有用）：

＆＃13;

function localizedDatetime(datetime_original, locale) {
  let parsedDatetime = moment.utc(datetime_original, 'YYYY-MM-DD HH:mm:ss Z');
  return parsedDatetime.toDate().toLocaleString(locale);
}

const input = '2018-05-09 09:46:33 UTC';
const fr = localizedDatetime('2018-05-09 09:46:33 UTC', 'fr-FR');
const en = localizedDatetime('2018-05-09 09:46:33 UTC', 'en-US');

console.log("Input: ", input);
console.log(">> FR:", fr);
console.log(">> EN:", en);

＆＃13;

<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.22.1/moment-with-locales.min.js"></script>

＆＃13;

Firefox无效的日期格式：rails server和angularJS client

1 个答案: