0

我目前正在创建 Web 应用程序，它将使用 REST API 从 UI GET/POST 数据到 postgreSQL，使用Angular CLI,node.js和TypeScript. 我几乎没有需要从 unix 时间戳转换为人类可读格式的日期字段，因此我选择了 DatePipe 方法来完成这项工作。但奇怪的是，unix 时间戳被 DatePipe 转换为错误的日期和时间。

我在 web 和 Stackoverflow 中遇到了几个与此相关的问题，但没有任何帮助。所以我决定发布我的一段代码并再次在这里发布。

我的 Component.ts 对应于 EDIT 页面

import { Component, OnInit } from '@angular/core';
import { RestApiService } from "../shared/rest-api.service";
import { ActivatedRoute, Router } from '@angular/router';
import { DatePipe } from '@angular/common';

@Component({
  selector: 'app-inventory-details',
  templateUrl: './inventory-edit.component.html',
  styleUrls: ['./inventory-edit.component.css'],
  providers: [DatePipe]
})

export class InventoryEditComponent implements OnInit {
  id = this.actRoute.snapshot.params['id'];
  inventoryData: any = {};

  constructor(
    public restApi: RestApiService,
    public actRoute: ActivatedRoute,
    public router: Router,
    public datepipe: DatePipe
  ) { 
  }

  ngOnInit() { 
    console.log("id value is"+ this.id)
    this.restApi.getInventory(this.id).subscribe((data: {}) => {
      this.inventoryData = data[0];
      console.log('the date element is ' +this.inventoryData.warranty_date)
      this.inventoryData.warranty_date = this.datepipe.transform(this.inventoryData.warranty_date, 'yyyy-MM-dd');
      this.inventoryData.purchased_date = this.datepipe.transform(this.inventoryData.purchased_date, 'yyyy-MM-dd');
      console.log('the date element is ' +this.inventoryData.warranty_date)
      console.log(JSON.stringify(data))
    })
  }

  // Update inventory data
  updateInventory() {
    if(window.confirm('Are you sure, you want to update?')){
      this.restApi.updateInventory(this.inventoryData).subscribe(data => {
        this.router.navigate(['/inventory-list'])
      })
    }
  }

}

库存-edit.component.html

<div class="container custom-container">
  <div class="col-md-12">

    <h3 class="mb-3 text-center">Update Inventory</h3>

    <div class="col-md-12 form-group form-inline">
      <label class="col-sm-3">Device Name</label>
      <input type="text" [(ngModel)]="inventoryData.device_name" class="form-control" placeholder="Device Name">
    </div>

    <div class="col-md-12 form-group form-inline">
      <label class="col-sm-3">Device Type ID</label>
      <input type="text" [(ngModel)]="inventoryData.device_type_id" class="form-control" placeholder="Device Type ID">
    </div>

    <div class="col-md-12 form-group form-inline">
      <label class="col-sm-3">Serial No</label>
      <input type="text" [(ngModel)]="inventoryData.serial_no" class="form-control" placeholder="Serial No">
    </div>

    <div class="col-md-12 form-group form-inline">
      <label class="col-sm-3">Model</label>
      <input type="text" [(ngModel)]="inventoryData.model" class="form-control" placeholder="MODEL">
    </div>

    <div class="col-md-12 form-group form-inline">
      <label class="col-sm-3">RAM ID</label>
      <input type="text" [(ngModel)]="inventoryData.ram_id" class="form-control" placeholder="RAM ID">
    </div>

    <div class="form-group"><div class="col-md-12 form-group form-inline">
      <label class="col-sm-3">HDD ID</label>
      <input type="text" [(ngModel)]="inventoryData.hdd_id" class="form-control" placeholder="HDD ID">
    </div>

    <div class="col-md-12 form-group form-inline">
      <label class="col-sm-3">Processor</label>
      <input type="text" [(ngModel)]="inventoryData.processor" class="form-control" placeholder="Processor">
    </div>

    <div class="col-md-12 form-group form-inline">
      <label class="col-sm-3">OS ID</label>
      <input type="text" [(ngModel)]="inventoryData.os_id" class="form-control" placeholder="OS ID">
    </div>

    <div class="col-md-12 form-group form-inline">
      <label class="col-sm-3">Warranty Date</label>
      <input type="date" [(ngModel)]="inventoryData.warranty_date" class="form-control" placeholder="Warranty Date">
    </div>

    <div class="col-md-12 form-group form-inline">
      <label class="col-sm-3">Purchase Date</label>
      <input type="date" [(ngModel)]="inventoryData.purchased_date" class="form-control" placeholder="Purchased Date">
    </div>

    <div class="col-md-12 form-group form-inline">
      <label class="col-sm-3">Description</label>
      <input type="text" [(ngModel)]="inventoryData.description" class="form-control" placeholder="Description">
    </div>

    <div class="col-md-12 form-group form-inline">
      <label class="col-sm-3">Repair</label>
      <input type="text" [(ngModel)]="inventoryData.repair" class="form-control" placeholder="Repair">
    </div>

    <div class="form-group">
      <button class="btn btn-success btn-lg btn-block" (click)="updateInventory()">Update Inventory</button>
    </div>

  </div>
</div>

我面临的问题

I'm getting below timestamps from postgreSQL DB which I want to convert
warranty_date: 1583778600
purchased_date: 1584037800

After converting the timestamps, I'm getting below results which is completely wrong
warranty_date: 01/19/1970
purchased_date: 01/19/1970

But expected results should be
warranty_date: 3/10/2020
purchased_date: 3/13/2020

即使我只是通过提取时间戳而不进行转换来仔细检查，以查看预期的时间戳是否反映在我的代码中，并且在 DatePipe 出现之前一切似乎都很好。

我不确定我在当前代码中犯了什么错误。在网上浏览了几个博客和示例之后，我发现这个 DatePipe 方法有点容易完成我的任务，但没有运气。在继续下一个方法之前，我真的很想了解为什么会发生这种情况。

有人可以帮我解决这个问题或理解为什么会这样吗？这与浏览器设置有关吗？

4

1 回答 1

2

您的 postgreSQL DB 以秒为单位使用时间戳，但 javascript Date 以毫秒为单位使用时间戳。

于 2020-05-18T15:59:14.470 回答