Формат даты в Angular на основе часового пояса

Question

Я получаю даты от моего API в формате UTC. Мне нужно вывести даты, используя местный часовой пояс пользователя. Каждому пользователю назначается часовой пояс, который я извлекаю из своего API.

Используя следующую документацию, я смог заставить все работать для всех часовых поясов с + (т.е. +100, +200 и т. Д.). Однако, когда у меня есть часовой пояс с - (то есть -800). Это не работает.

Работает:

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

Первоначальное значение: 7 января 2019 года 00:46

Новое значение: 7 января 2019 года 16:46

НЕ работает (часовой пояс игнорируется):

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

Первоначальное значение: 7 января 2019 года 00:46

Новое значение: 7 января 2019 года 00:46

Класс Angular, используемый после вызова API

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' }}

Смотрите этот стек для демонстрации.