将“esriFieldTypeDate”转换为人类可读（使用 JS）答案

【问题标题】：convert 'esriFieldTypeDate' to human readable (with JS)将“esriFieldTypeDate”转换为人类可读（使用 JS）
【发布时间】：2020-07-16 13:18:57
【问题描述】：

......
dlv.innerHTML = `<b><span class='name_plc'></span></b><br>ID: <span class="ida">${feature.graphic.attributes.id}</span><br> URL: <a href="${feature.graphic.attributes.url}" target="_blank">View</a> <br> Updated: <span class='tiCon1'>${feature.graphic.attributes.updated}</span><br>Grid_value: ${feature.graphic.attributes.grid_value}<br> Event Time: <span class='tiCon2'>${feature.graphic.attributes.eventTime}</span> <style>.esri-popup__navigation { display: none;}</style>`;

let date1= $('.tiCon1').text();
let dt = new Date(date1).toUTCString();
console.log(dt);
......

上述尝试显示为“无效日期”。

我尝试上面的方法来转换它，例如，它控制台为无效日期...

在上面，我的事件时间和更新的查询通过esriFieldTypeDate解析为以下数字。我想将它们转换为人类可读的格式。

更新：1593543128000

活动时间：1593021559000

下面的另一次尝试，无论我做什么，我都会收到 invalid date 或 NaN 错误。

            setTimeout(() => {
                  let dCn = $('.tiCon1').text();
                  console.log(dCn); // consoles as 1593543128000 
                  let dtD = new Date(dCn).toUTCString();
               
                  console.log(dtD);
              }, 28);

更新:: 如果我 JSON 解析我上面的 dCn var 值.. 它确实有效.. 正确显示格式化的日期，但是它会在控制台中引发 JSON 错误。我该如何解决这个问题？

未捕获的 SyntaxError：JSON 中位置 0 处的意外标记 M

【问题讨论】：

new Date(parseInt(dCn)).toUTCString();?
谢谢，但返回“无效日期”
JSON.parse 是我得到的壁橱，其他一切都只是从无效日期错误循环到 NaN 错误......不明白为什么......因为它需要是一个对象，我正在抓取而是完成解析的文本值？但后来我不知道如何在弹出模板中使用 arcgis 将该值作为变量调用；在 innerHTML 中起作用的东西在 ${feature...... 之外不起作用
new Date(1593543128000).toUTCString(); 不会返回无效日期，那么该值必须是其他值。

标签： javascript date arcgis-js-api

【解决方案1】：

使用这些值的任何 Date JavaScript 方法都应该没有问题。您收到的数字是日期数字、时间戳，表示自 1970 年 1 月 1 日 UTC 以来的毫秒数。

看看我为你制作的这个例子。

<!DOCTYPE html>
<html>

<head>
  <meta charset="utf-8" />
  <meta name="viewport" content="initial-scale=1,maximum-scale=1,user-scalable=no" />
  <title>
    esriFieldTypeDate | ArcGIS API for JavaScript 4.16
  </title>

  <link rel="stylesheet" href="https://js.arcgis.com/4.16/esri/themes/light/main.css" />
  <script src="https://js.arcgis.com/4.16/"></script>

  <style>
    html,
    body,
    #viewDiv {
      padding: 0;
      margin: 0;
      height: 100%;
      width: 100%;
    }
  </style>

  <script>
    require([
      "esri/Map",
      "esri/views/MapView",
      "esri/layers/FeatureLayer"
    ], function (Map, MapView, FeatureLayer) {
      const map = new Map({
        basemap: "gray"
      });

      const view = new MapView({
        container: "viewDiv",
        map: map,
        center: [-122, 37],
        zoom: 2
      });

      const featureLayer = new FeatureLayer({
        url:
          "https://services9.arcgis.com/RHVPKKiFTONKtxq3/arcgis/rest/services/USGS_Seismic_Data_v1/FeatureServer/1"
      });

      const popupTemplate = {
        title: "{id}",
        outFields: ["*"],
        content: popupTemplateContent,
      };

      featureLayer.popupTemplate = popupTemplate;

      function customDateToString(d) {
        return `${d.getMonth()+1}/${d.getDate()}/${d.getFullYear()}`;
      }

      function popupTemplateContent(feature) {
        const div = document.createElement("div");
        const et = feature.graphic.attributes.eventTime;
        const u = feature.graphic.attributes.updated;
        const det = new Date(et);
        const du = new Date(u);
        div.innerHTML =
          `et = Event Time<br>` +
          `u = Updated<br>` +
          `et : ${et} <br>` +
          `u : ${u} <br>` +
          `Date(et).toString() : ${det.toString()} <br>` +
          `Date(u).toString() : ${det.toString()} <br>` +
          `Date(et).toUTCString() : ${det.toUTCString()} <br>` +
          `Date(u).toUTCString() : ${det.toUTCString()} <br>` +
          `Date(et).toUTCString() : ${det.toISOString()} <br>` +
          `Date(u).toUTCString() : ${det.toISOString()} <br>` +
          `customDateToString(Date(et)) : ${customDateToString(det)} <br>` +
          `customDateToString(Date(u)) : ${customDateToString(det)}`;
        return div;
      }

      map.add(featureLayer);
    });
  </script>
</head>

<body>
  <div id="viewDiv"></div>
</body>

</html>

【讨论】：