将带有字符串日期的json响应转换为JS日期的Angular 8方法？答案

【问题标题】：Angular 8 way to convert json response with string dates to JS date?将带有字符串日期的json响应转换为JS日期的Angular 8方法？
【发布时间】：2020-10-30 19:46:53
【问题描述】：

我知道 json 不会以特殊方式处理日期，而是将它们作为来自服务器的字符串提供。有没有办法提供具有 ISO 日期属性的 json 对象响应，并将其映射到已经将日期属性映射为 JS 日期的类？

例子：

Json 响应：

{
    "data": {
        "id": 1,
        "name": "John",
        "surname": "Smith",
        "birthDate": "1986-05-04T22:59:59.000Z"
        "subscriptionDate": "2020-06-28T14:36:43.498Z"
    }
}

我有这门课：

export class User {

    id: string;
    name: string;
    surname: string;
    birthDate: Date;
    subscriptionDate: Date;

}

我的服务方式：

getUser(id: string): Observable<User> {
    return this.http.get<User>(`${this.UrlService}estabelecimentos/${id}`, { headers: this.authenticationService.jwt() }).catch(super.serviceError);
}

但是当我在组件中使用它时，birthDate 和 subscriptionDate 总是被视为字符串。有没有办法将其转换为 JS 日期，而不必通过迭代 json 响应和修改对象来格式化每个请求中的日期？

【问题讨论】：

标签： angular angular-date-format

【解决方案1】：

我建议在返回之前转换 json 响应，如下所示：

getAll(): Observable<Session[]> {
  return this.apiService.get(`/sessions`).pipe(
    map((data)=>{
      return data.map((session) => {
        session.startDate = new Date(session.startDate);
        session.endDate = new Date(session.endDate);
        return session;
      }
    )})
  );
}

【讨论】：

【解决方案2】：

JSON 不提供对日期的任何特殊支持。您需要手动转换它。如下：

new Date("1986-05-04T22:59:59.000Z");

将 JSON 对象转换为 Javascript 对象可以帮助您实现所需。

检查此功能：

function convertJsonIntoJavaScript(data){
let newObj = new Object();
   Object.keys(data).forEach(x=> {
   let d = new Date(data[x]);
   newObj[x]= (d instanceof Date && !isNaN(d))? d: data[x];
});
return newObj;
}

注意：我没有测试过这个功能，如果它有效，请在下面的评论中写下您的反馈。

【讨论】：

问题不是将字符串转换为日期，而是手动为多个字段和类做。
@PhilippeGioseffi ，刚刚在答案中添加了一个函数。虽然我无法测试它，但我相信这应该可行。

【解决方案3】：

由于 GET 将返回一个 observable，您应该能够执行以下操作：

getUser(id: string): Observable<User> {
  return this.http.get<User>(`${this.UrlService}estabelecimentos/${id}`, { headers: this.authenticationService.jwt() })pipe(
    map(response => {
      return {
        "data": {
          "id": response.id,
          "name": response.name,
          "surname": response.surname,
          "birthDate": new Date(response.birthDate)
          "subscriptionDate": new Date(response.subscriptionDate)
      }
    }),
    catchError(()=> super.serviceError)
  )
}

【讨论】：

【解决方案4】：

简短的回答是否定的，因为 JSON 格式不允许日期类型。看到这个：https://www.w3schools.com/JS/js_json_datatypes.asp

除了将它们转换为 Date 对象之外，我认为您别无选择，此外，考虑到您的字符串日期格式，这相对微不足道：

ndate = new Date("1986-05-04T22:59:59.000Z")

【讨论】：

问题不是将字符串转换为日期，而是手动为多个字段和类做。
那么你想达到什么目的？ “有没有办法将它转换为 JS 日期，而不必通过迭代 json 响应和修改对象来格式化每个请求中的日期？”您问是否可以将 JSON 字段转换为 JS Date 对象而无需格式化日期，答案是否定的。根据上面的链接，JSON 数据类型不允许日期对象。
我认为 Angular 具有诸如 http 拦截器之类的机制，可以拦截响应并修改数据。这就是我需要的。
为什么要使用http拦截器来修改数据？对我来说，这似乎不是 Angular 的最佳实践。最好创建一个位于组件和 API 服务之间的服务，并在那里映射/转换数据。