md-Datepicker + reaktive Formen + + Feuerbasis Winkel 4

Question

Ich habe:
carico.model.ts

export class Carico { 
    $key: string; 
    dataCarico: Date; 
    riferimentoCarico: string; 
    dettaglio:{ 
    carburante: string; 
    quantita: string; 
    } 
} 

in meinem Dienst:
carichi.service.ts

import { Injectable } from '@angular/core'; 
....some code...  
import { Carico } from './carico.model'; 

@Injectable() 
export class CarichiService { 
    ...some code...  

    getCarichiList(query = {}): FirebaseListObservable<Carico[]> { 
    if (!this.userId) return; 
    this.carichi = this.db.list(`carico/${this.userId}`, { query: query } 
    ); 
    return this.carichi 
    }  
    ...some code... 

    createCarico(carico: Carico): void { 
    this.carichi.push(carico) 
     .catch(error => this.handleError(error)) 
    }  
} 

in Meine Formularkomponente:
new-carico-form.component.ts

import { Carburante } from '../../impostazioni/carburanti/carburante.model'; 
import { CarburantiService } from '../../impostazioni/carburanti/carburanti.service'; 
...some code... 

constructor(...) {  
    this.createForm(); 
    } 

    ngOnInit() { 
    this.carburanti = this.carburantiService.getCarburantiList(); 
    } 

    createForm() { 
    this.caricoForm = this.fb.group({ 
     dataCarico: Date, 
     riferimentoCarico: [''], 
     dettaglio: this.fb.group({   
     carburante: '', 
     quantita: '' 
     }) 
    }); 
    } 

inserisciCarico(carico: Carico) { 
    this.carichiService.getCarichiList();  
    this.carichiService.createCarico(this.caricoForm.value);  
    this.caricoForm.reset(); 
    } 

    onSubmit() { 
    } 

} 

und meine html:
new-carico-form-component.html

<md-card> 
    <form [formGroup]="caricoForm" novalidate> 
     <md-card-content> 
     <md-input-container > 
      <input mdInput [mdDatepicker]="picker" placeholder="seleziona data" formControlName="dataCarico"> 
      <button mdSuffix [mdDatepickerToggle]="picker" ></button> 
     </md-input-container> 
     <md-datepicker #picker></md-datepicker> 
     <span class="col"> </span> 
     <md-input-container> 
      <input mdInput placeholder="riferimento" formControlName="riferimentoCarico"> 
     </md-input-container> 
     <table formGroupName="dettaglio">   
      <tr> 
      <td> 
       <md-select placeholder="carburante" formControlName="carburante">      
...some code... 

Das Problem ist, dass ich die Form das einzige, was retten kann, die nicht das Datum nicht funktioniert. Ich habe versucht, in der Konsole vor und nach dem Abonnement zu zeigen und das Datum ist in der Form. irgendwelche Vorschläge? Ich gehe in Firebase zurück und es gibt alles außer dem Datum.

Answer 1

Sie nicht Lage sein, ein Date Objekt in der Datenbank Feuerbasis zu drücken. Sie müssen die Date zu Millisekunden oder eine Zeichenfolge mit so etwas wie Date.prototype.toISOString() oder Date.prototype.getTime()

inserisciCarico(carico: Carico) { 
    this.carichiService.getCarichiList(); 
    let formValue = this.caricoForm.value; 
    formValue.dataCarico = formValue.dataCarico.getTime(); 
    // or 
    // formValue.dataCarico = formValue.dataCarico.getISOString(); 

    this.carichiService.createCarico(formValue);  
    this.caricoForm.reset(); 
} 

verwandeln Wenn Sie den Typ der Object.prototype.toString.call(carico.dateCarico) mit dateCarico überprüfen Sie werden sehen, es ist ein [object Date] vom mdDatepicker, muss dies in Millisekunden oder Zeichenfolge konvertiert werden, um zur Firebase-Datenbank wechseln zu können.

Sie müssen wahrscheinlich Carico Klasse ändern, entweder ein Datum oder eine Zeichenfolge akzeptieren:

dataCarico: Date | string; 

Hoffnung, das hilft!