Ist es richtig, einen benutzerdefinierten NgbDateParserFormatter zu implementieren, um das Format des Eingabewerts für NgbInputDatepicker zu ändern?
Ich bin mit dem datepicker (ng-boostrap) in einem popup und ich möchte das Datumsformat ändern, zu dd-mm-yyyy
.
Scheint es, dass es gelöst werden kann durch die Implementierung einer neuen NgbDateParserFormatter
zu ersetzen, die Standard -NgbDateISOParserFormatter
.
Aber ich Frage mich, ob es einen anderen Weg gibt.
UPDATE:
Einer kleinen Implementierung von NgbDateParserFormatter
mit Moment.js
(getestet mit der version 1.0.0-alpha.14 ng-bootstrap):
import {NgbDateParserFormatter, NgbDateStruct} from '@ng-bootstrap/ng-bootstrap';
import * as moment from 'moment';
export class NgbDateMomentParserFormatter extends NgbDateParserFormatter {
constructor(private momentFormat: string) {
super();
};
format(date: NgbDateStruct): string {
if (date === null) {
return '';
}
let d = moment({ year: date.year,
month: date.month - 1,
date: date.day });
return d.isValid() ? d.format(this.momentFormat) : '';
}
parse(value: string): NgbDateStruct {
if (!value) {
return null;
}
let d = moment(value, this.momentFormat);
return d.isValid() ? { year: d.year(),
month: d.month() + 1,
day: d.date() } : null;
}
}
Und in ein Modul einfügen, fügen Sie den Anbieter mit einer Fabrik, um das Datum-format als parameter:
---
@NgModule({
---
providers: [
{
provide: NgbDateParserFormatter,
useFactory: () => { return new NgbDateMomentParserFormatter("DD-MM-YYYY") }
}
]
---
})
InformationsquelleAutor der Frage Nelson Lopez Centeno | 2016-09-17
Du musst angemeldet sein, um einen Kommentar abzugeben.
Heute die Implementierung einer benutzerdefinierten
NgbDateParserFormatter
ist der beste Weg zu gehen. Also ja, es ist eine richtige Art und Weise.In der Zukunft werden wir vielleicht eine anspruchsvollere Umsetzung der
NgbDateParserFormatter
wo Sie in der Lage, übergeben Sie einfach im gewünschten format (ex.yyyy-MM-dd
). Das hinzufügen dieser Funktion wird abhängig von Benutzer, von Interesse.Könnten Sie auch überprüfen, einige weitere hintergrund-Infos in https://github.com/ng-bootstrap/ng-bootstrap/issues/754#issuecomment-247767027
InformationsquelleAutor der Antwort pkozlowski.opensource