Question

我正在尝试在模板视图中显示一些firebase时间戳，不幸的是没有运气角度datePipe。

<p>Seen {{user.updatedAt | date: 'yyyy/MM/dd h:mm:ss a'}}</p>

我确实收到了这个错误：

     ERROR Error: InvalidPipeArgument: 
'Unable to convert "Timestamp(seconds=1528515928, nanoseconds=105000000)" 
into a date' for pipe 'DatePipe

Answer 1

尝试使用此{{ user.updatedAt.seconds * 1000 | date:'MM-dd-yyyy' }}，时间戳记具有seconds属性，因此您需要访问它，然后进行乘法和管道运算。希望它适合您的情况。

Answer 2

显示的时间是时间戳而不是实际日期。你需要将时间乘以1000。

<p>Seen {{user.updatedAt * 1000 | date:'MM-dd-yyyy'}}</p>

Answer 3

我在Angular 7中使用了简单的自定义管道。它考虑了LOCALE_ID，并且您还可以使用所有DatePipe格式：

import {formatDate} from '@angular/common';
import {Inject, LOCALE_ID, Pipe, PipeTransform} from '@angular/core';
import {firestore} from 'firebase/app';
import Timestamp = firestore.Timestamp;

@Pipe({
    name: 'firestoreDate'
})
export class FirestoreDatePipe implements PipeTransform {

    constructor(@Inject(LOCALE_ID) private locale: string) {
    }

    transform(timestamp: Timestamp, format?: string): string {
        return formatDate(timestamp.toDate(), format || 'medium', this.locale);
    }
}

Answer 4

而不是 yourDate: Date 使用来自yourDate: Timestamp

的'@firebase/firestore-types';

read

Answer 5

Date管道自UTC时代以来将花费毫秒数。 https://angular.io/api/common/DatePipe。 Firebase时间戳提供UTC纪元时间的秒数和几分之一秒。我用...

new Date(0).setUTCSeconds(YOURFIREBASEDOC.updatedAt['seconds'])

Answer 6

您可以将时间戳转换为毫秒或日期：

<p>Seen {{user.updatedAt.toMillis() | date:'yyyy/MM/dd h:mm:ss a'}}</p>

或

<p>Seen {{user.updatedAt.toDate() | date:'yyyy/MM/dd h:mm:ss a'}}</p>

Answer 7

使用您模型中的任何人进行更新。

import { DatePipe } from '@angular/common';

export class class1 implements OnInit {

    constructor(private datePipe: DatePipe) { }

    youMethod() {
        let aNewDate = this.datePipe.transform(user.updatedAt.toDate(),"medium");
        console.log(aNewDate)
        // This will print in format  Jun 5, 2018, 5:45:31 PM
   }

}

您可以使用任何日期格式（“中”）显示日期变量。

Answer 8

您可以捕获服务中的所有“时间戳记”属性并将其全部转换为日期。

例如：

import { firestore } from 'firebase/app';
import Timestamp = firestore.Timestamp;

@Injectable()
export class YourService {

....

    list = (): Observable<any[]> => this.collection
        .snapshotChanges()
        .pipe(
            map(changes => {
                return changes.map(a => {
                    const data = a.payload.doc.data() as any;
                    Object.keys(data).filter(key => data[key] instanceof Timestamp)
                        .forEach(key => data[key] = data[key].toDate())
                    data._id = a.payload.doc.id;
                    return data;
                });
            })
        );

...
}

Answer 9

您可以使用日期过滤器，但是我个人使用 rxjs映射管道

在获取数据时进行日期转换

this.afs.collection('users')
  .valueChanges()
  .pipe(map(
    (users: any[]) => users.map(user => ( {...user, date: user.updatedAt.toDate()} ))
  ))
  .subscribe(result => {
    console.log('result: ', result);
  })

如何使用角度日期管道转换firebase时间戳

9 个答案: