angular - 基于时区在Angular中格式化日期

Question

我从我的 API 接收 UTC 格式的日期。我需要使用用户的本地时区输出日期。每个用户都分配了一个我从不同 API 中提取的时区。

使用以下文档，我能够使用 +（即 +100、+200 等）使所有时区都能正常工作。但是，当我的时区带有-（即-800）时。这不起作用。

作品：

{{element.myDate | date:'d-MMM-yyyy HH:mm' : '+800' }}

原始值：2019 年 1 月 7 日 00:46

新值：2019 年 1 月 7 日 16:46

不工作（时区被忽略）：

{{element.myDate | date:'d-MMM-yyyy HH:mm' : '-800' }}

原始值：2019 年 1 月 7 日 00:46

新值：2019 年 1 月 7 日 00:46

调用 API 后使用的 Angular 类

export class MyClass {
  constructor(
    public myDate: Date,
    public otherData: string
  ) {}
}

Answer 1

由于日期在 Angular 中被视为“本地”，因此您可以先将其转换为 UTC，然后在视图中显示结果。下面的转换方法假设myUtcDate元素类中存在一个属性：

this.myUtcDate = new Date(Date.UTC(
  this.myDate.getFullYear(),
  this.myDate.getMonth(),
  this.myDate.getDate(),
  this.myDate.getHours(),
  this.myDate.getMinutes(),
  this.myDate.getSeconds()
));

{{ element.myUtcDate | date:'d-MMM-yyyy HH:mm' : '-800' }}

请参阅此 stackblitz以获取演示。