无法使用ionic2/angular2在iOS/Safari中正确显示日期时间

Question

嗨即时通讯面临一个奇怪的问题在这里即时通讯获取动态数据即时通讯也获取日期和时间和我在html中使用日期管道在chrome/android中显示它它工作正常,但当我检查ios/Safari它显示时差

下面是我消耗的json数据

FromCurrentDate: "2018-01-05T00:00:00"

FromPreviousDate: "2018-01-04T00:00:00"


ToCurrentDate: "2018-01-05T14:00:53.137"

ToPreviousDate: "2018-01-04T14:00:53.137"

即时显示这样的日期,在chrome/android中它显示如下

在Ios/safari中,它使用下面的代码在模板中显示如下

Currrent {{singleTable[0].FromCurrentDate|date: 'dd/MM/yyyy,h:mm:ss a'}} to {{singleTable[0].ToCurrentDate|date: 'dd/MM/yyyy,h:mm:ss a'}}

我怎样才能解决这个时差问题？

Answer 1

您面临的问题是由Intlapi 引起的,因为DatePipeAngular 2 Release仅适用于具有自定义格式字符串的FireFox和Chrome.由于缺乏Intl,它在Safari上不起作用.因此临时工作是包括Intl polyfill

<script src="https://cdn.polyfill.io/v2/polyfill.min.js?features=Intl.~locale.en"></script>

解决方案2 您可以使用可以格式化所需日期的moment.js,如下所示

moment(singleTable[0].FromCurrentDate).format("dd/MM/yyyy,h:mm:ss a")

更新1

在最新的角度,他们已经删除了Intl api,为此你需要更新到角度5,参考

更新2 这是一个使用角度味道的MomentJs的 plunker,我添加了你的日期格式,但没有测试在chrome中测试的safari,

Answer 2

在ios/mac中,日期过滤器不起作用,因此请使用moment.js.

我已经尝试了很多东西但是我能够在moment.js做得最好

喜欢:我创造了一个烟斗

<span>{{ActionDate | dateTimeFormatFilter : "MMM DD, YYYY"}}</span>

@Pipe({name: "dateTimeFormatFilter"})
@Injectable()
export class DateTimeFormatPipe implements PipeTransform {
transform(date: any, format: string): any {
        if (date) {
         return moment(date).format(format);
        }
    }
}

Answer 3

我在桌面上的 safari 和 iPhone 上的 safari/chrome 上遇到了同样的问题。当日期对象用作值时，它适用于 safari 或几乎所有浏览器。(日期管道)

我通过添加自定义管道将日期时间字符串转换为日期对象解决了同样的问题，然后日期管道按预期工作。

成分

someDate1 = "2019-09-01 12:02:14";
someDate2 = "2019-09-01";
someDate3 = "2019-09-01 00:00:00";

模板

{{ someDate1 | toDateObj | date:'MM-dd-yyyy h:mm a' }}

这是toDateObj我添加的自定义管道。

import { Pipe, PipeTransform } from '@angular/core';

@Pipe({
  name: 'toDateObj'
})

export class ToDateObjPipe implements PipeTransform {

    transform(value: any): any {
        if (value) {
            if (value.toString().indexOf(' ') === -1) {
                value = value + ' 00:00:00';
            }
            const temp = value.toString().replace(' ', 'T');
            return new Date(temp);
        } else {
            return null;
        }
    }

}