угловая пожарная база Тип 'string' не может быть назначен типу 'Date

Question

Я получаю сообщение об ошибке.

не может прочитать свойство 'toDate' из неопределенного.Без toDate() | Date

я получаю

Отметка времени (секунд = 1545109200, наносекунд = 0)

Я ссылался на это Моментальный снимок из Firebase Angular 6 возвращает неопределенное значение

, однако его преобразование временной метки в читаемую строку даты не является специфичным.желаемый результат будет 6 декабря 2018 года. В том же духе.

schedule-list.component.html

<div class="container ">
    <div class="row">
      <div *ngFor="let appoint of list" class="col-md-8 myCenter mt-2"> 
        <!-- the bottom code should work if items within list exist. -->
        <div class="card">
          <div class="card-header">
              Title: {{appoint.name}}

          </div>
          <div class="card-body">
            <p>{{appoint.appointment_date.toDate() | date}}</p>
          </div>
      </div>
    </div>
  </div>
</div>

schedule.model.ts

export class Schedule {
    name:string;
    appointment_date:string;
}

Pipe.ts

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: 'fireStoreDatePipe'
})
export class FireStoreDatePipePipe implements PipeTransform {

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

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

Schedule-list.component.ts

import { Component, OnInit } from '@angular/core';
import { AngularFirestore } from '@angular/fire/firestore';
import { ScheduleService } from '../schedule.service';
import { Schedule } from '../models/schedule.model';
import {FireStoreDatePipePipe} from '../fire-store-date-pipe.pipe';
import { Timestamp } from '@firebase/firestore-types';
@Component({
  selector: 'app-schedule-list',
  templateUrl: './schedule-list.component.html',
  styleUrls: ['./schedule-list.component.css']
})
export class ScheduleListComponent implements OnInit {
  list:Schedule[];
  constructor(private firestore: AngularFirestore, private service: ScheduleService ) { }

  ngOnInit() {
    this.service.getAppointments().subscribe(actionArray =>{
      this.list = actionArray.map(item =>{
        return{
          ...item.payload.doc.data()
        } as Schedule;
      })
    });
  }

  getSchedules(){
    return this.firestore.collection('schedules').snapshotChanges();
  }

}

Answer 1

Вы должны умножить свою метку времени на 1000, я уже сталкивался с той же проблемой;

попробуйте это:

<p>{{ appoint.appointment_date.seconds * 1000 | date:'dd:MM:yyyy hh:mm:ss' }}</p>

Answer 2

Потому что у вас есть отметка времени со вторым, вы можете сделать следующее, чтобы сделать ее датой:

ngOnInit() {
    this.service.getAppointments().subscribe(actionArray =>{
      this.list = actionArray.map(item =>{
        return{
          ...item.payload.doc.data()
        } as Schedule;
      })
      for(let i = 0; i < this.list.length; i++){
        console.log(this.list[i].appointment_date); // to see if the data is undefined!
        this.list[i].appointment_date = new Date(new Date(0).setUTCSeconds(this.list[i].appointment_date.seconds));
      }
    });
  }
));