Material js date-picker und ng-Modell date string mismatch

Question

Ich habe einige Fragen zu AngularJS ng-Modell und Angular Materia date-picker. Ich habe zwei Probleme. Eine davon ist, dass das Datum, das auf der Eingabe des Datumswählers angezeigt wird, sich von dem ng-Modellwert unterscheidet. Der andere ist, dass, wenn ein Benutzer das Datum im Kalender auswählt, der ng-Modellwert sich von dem Datum unterscheidet, das der Benutzer ausgewählt hat. Hier sind die Details.

Also habe ich dieses String-Variable in einem Controller $scope.formData["begin_date"] = "2017-09-25"

und das ist mein HTML-Tag

<md-input-container > 
    <label>Start date</label> 
     <md-datepicker required ng-model="formData.begin_date"></md-datepicker> 
     </md-input-container> 

Aber hier ist das, was mein Browser mir zeigt. Das Datum, das ich anzeigen wollte, ist 2017-09-25 auf der Eingabe, aber 2017-09-24 wird stattdessen angezeigt. Hier ist das Bild.

Und ich verstehe nicht, wie ich dieses Problem beheben kann, um das genaue Datum zu zeigen, das ich zeigen wollte.

Ich möchte auch, dass Benutzer in der Lage sind, ein Datum mit Datumsauswahl auszuwählen und das Datum zu sehen, das im Browser ausgewählt wird. Wenn ein Benutzer jedoch das Datum auswählt, zeigt das ng-Modell, das an den Datumswähler gebunden ist, ein anderes Datum an. Zum Beispiel wählt ein Benutzer 2017-09-28 im Kalender wie unten. user picks 2017-09-28

Aber das Angular ng-Modell zeigt den anderen Datumswert als das Datum, das der Benutzer aus dem Kalender wie unten ausgewählt hat. Auf den Web-Browsern zeigt es "2017-09-29T00:00:00.000Z" und ich möchte nur einfach anzeigen 2017-09-28

Wie kann ich diese beiden Probleme beheben?

Vielen Dank für Ihre Hilfe.

Answer 1

Also habe ich dieses String-Variable in einem Controller $ scope.formData [ "BEGIN_DATE"] = "2017.09.25"

schreibt begin_date als Date Objekt:

$scope.formData = { 
    begin_date: new Date("2017-09-25") 
    }; 

DEMO CODEPEN