2017-12-31 31 views
0

Wie kann ich Mat-Datepicker Datum im MM/TT/YYYY Format anpassen?Eckiges Material 5 - Wie man das Datum in Mat-Datepicker einstellt

ich folgende folgende Konfiguration bin mit:

HTML:

<mat-form-field> 
    <input matInput [matDatepicker]="picker" placeholder="Choose a date"> 
    <mat-datepicker-toggle matSuffix [for]="picker"></mat-datepicker-toggle> 
    <mat-datepicker #picker></mat-datepicker> 
</mat-form-field> 

TS:

import {Component} from '@angular/core'; 

/** @title Basic datepicker */ 
@Component({ 
    selector: 'datepicker-overview-example', 
    templateUrl: 'datepicker-overview-example.html', 
    styleUrls: ['datepicker-overview-example.css'], 
}) 
export class DatepickerOverviewExample {} 

Wenn ich die Form Wert drucken es gibt mir folgende Ausgabe:

Sun 31. Dezember 2017 00:00:00 GMT + 0530 (IST)

Ich erwarte Format in MM/DD/YYYY.

habe ich versucht, diese Konfiguration: https://material.angular.io/components/datepicker/overview#customizing-the-parse-and-display-formats

Aber es nicht für mich zu arbeiten. Ich verwende Standard MatNativeDateModule (Nicht Moment js)

+0

MatNativeDateModule speichern das Datum als Date-Objekt. Ein Date-Objekt hat kein Format. Es handelt sich um ein Objekt, das seit 1970 eine Reihe von Millis umhüllt. Aber Sie können es beispielsweise so formatieren, wie Sie möchten, zum Beispiel mit der Datums-Pipe. –

+0

Versuchen Sie Folgendes: https://stackoverflow.com/questions/48396025/how-to-customize-date-in-mat-datepicker-to-2017-11-20t112300-angular-mater/48804115#48804115 –

Antwort

2

Sie können Sie das Datum Rohr wie folgt verwenden,

<input mdInput placeholder="Title" [ngModel]="mydate | date:'MM-dd-yyyy'"> 

DEMO

+0

Vielen Dank. Wenn ich [ngMode] = "mydate | date: 'MM-dd-yyyy'" hinzufüge, heißt es. Property 'mydate' existiert nicht auf Typ 'FormDateComponent' irgendeine Idee, was hier falsch ist? –

+0

Ich habe Variable Mydate hier verwendet, müssen Sie mit Ihrer Modellvariable ersetzen. markieren, wenn die Antwort geholfen – Sajeetharan

+0

Danke für die Antwort. Ich habe es herausgefunden. Es funktioniert perfekt :) –

Verwandte Themen